Update to reactive 18.1.0 - react-native

I try create a react-app with npx create-native init project but the react version was 17.0.2.
I used npm install react react-dom( following https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html) to update for the new version but now I received the message when I try create a nem project: npm ERR! could not determine executable to run.
What should I do?
log:
38 verbose stack Error: could not determine executable to run
38 verbose stack at getBinFromManifest (C:\Users\55319\AppData\Roaming\npm\node_modules\npm\node_modules\libnpmexec\lib\get-bin-from-manifest.js:17:23)
38 verbose stack at exec (C:\Users\55319\AppData\Roaming\npm\node_modules\npm\node_modules\libnpmexec\lib\index.js:135:15)
38 verbose stack at async module.exports (C:\Users\55319\AppData\Roaming\npm\node_modules\npm\lib\cli.js:78:5)
39 verbose pkgid create-native#1.0.0
40 verbose cwd C:\Users\55319
41 verbose Windows_NT 10.0.19044
42 verbose node v16.15.0
43 verbose npm v8.8.0
44 error could not determine executable to run
45 verbose exit 1
46 timing npm Completed in 2369ms
47 verbose code 1
48 error A complete log of this run can be found in:
48 error C:\Users\55319\AppData\Local\npm-cache_logs\2022-05-12T01_59_05_028Z-debug-0.log
CMD

It installed that version because that's the version it's compatible with, as of this writing (RN 68.1). React Native often doesn't use the latest version of React. If you open up the changelog for React Native and search for React 17, you'll see it was introduced into React Native version 64.0. There are no hits for React 18 because it hasn't yet been integrated.

Related

How to debug and fix npm and yarn connection issues?

I am trying to create a new create-react-app project (yarn create react-app my-app and npm init react-app my-app and npx create-react-app my-app) but it fails with network / connection issues (logs shown below). I have tried a bunch of fixes but nothing works. What else can I try or how can I check if it really is a network issue (how to debug)?
What I've tried:
Successfully run other yarn and npm commands
yarn add axios and npm install axios
Checked .npmrc and it has registry=https://registry.npmjs.org/
Increased yarn's network timeout yarn install --network-timeout 1000000
Reinstalled create react app
npm uninstall -g create-react-app
&& npm install -g create-react-app -d
Checked the proxy settings yarn config get proxy // undefined yarn config get https-proxy // undefined
Made sure my version of npm (9.4.0) supports tls1.2 npm install -g https://tls-test.npmjs.com/tls-test-1.0.0.tgz
If I run yarn create react-app my-app it logs
yarn create v1.22.19
[2/4] 🚚 Fetching packages...
info There appears to be trouble with your network connection. Retrying...
error An unexpected error occurred: https://registry.yarnpkg.com/tar/-/tar-2.2.2.tgz: aborted.
This is the output in the bug report
Trace:
Error: aborted
at connResetException (node:internal/errors:718:14)
at TLSSocket.socketCloseListener (node:_http_client:456:19)
at TLSSocket.emit (node:events:525:35)
at node:net:320:12
at TCP.done (node:_tls_wrap:588:7)
If I run npm init create-react-app my-app it logs the following to the console
npm ERR! code ECONNRESET
npm ERR! network aborted
npm ERR! network This is a problem related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly. See: 'npm help config'
This is the output in the bug report
…
385 notice Beginning October 4, 2021, all connections to the npm registry - including for package installation - must use TLS 1.2 or higher. You are currently using plaintext http to connect. Please visit the GitHub blog for more information: https://github.blog/2021-08-23-npm-registry-deprecating-tls-1-0-tls-1-1/
386 http fetch POST 426 http://registry.npmjs.org/-/npm/v1/security/audits/quick 150ms
387 verbose audit error HttpErrorGeneral: 426 Upgrade Required - POST
387 verbose audit error at async AuditReport.run (/Users/.nvm/versions/node/v18.13.0/lib/node_modules/npm/node_modules/#npmcli/arborist/lib/audit-report.js:106:19) {
387 verbose audit error headers: [Object: null prototype] {
387 verbose audit error date: [ 'Fri, 27 Jan 2023 00:52:26 GMT' ],
387 verbose audit error 'content-type': [ 'text/plain' ],
387 verbose audit error 'content-length': [ '271' ],
387 verbose audit error connection: [ 'keep-alive' ],
387 verbose audit error 'npm-notice': [
387 verbose audit error 'Beginning October 4, 2021, all connections to the npm registry - including for package installation - must use TLS 1.2 or higher. You are currently using plaintext http to connect. Please visit the GitHub blog for more information: https://github.blog/2021-08-23-npm-registry-deprecating-tls-1-0-tls-1-1/'
387 verbose audit error ],
387 verbose audit error vary: [ 'Accept-Encoding' ],
387 verbose audit error server: [ 'cloudflare' ],
387 verbose audit error 'cf-ray': [ '78fd816fa9cc5ab4-MEL' ],
387 verbose audit error via: [ 'HTTP/1.1 m_proxy_mel1' ],
387 verbose audit error 'x-fetch-attempts': [ '1' ]
387 verbose audit error },
387 verbose audit error statusCode: 426,
387 verbose audit error code: 'E426',
387 verbose audit error method: 'POST',
387 verbose audit error uri: 'http://registry.npmjs.org/-/npm/v1/security/audits/quick',
387 verbose audit error body: <Buffer 42 65 67 69 6e 6e 69 6e 67 20 4f 63 74 6f 62 65 72 20 34 2c 20 32 30 32 31 2c 20 61 6c 6c 20 63 6f 6e 6e 65 63 74 69 6f 6e 73 20 74 6f 20 6e 70 6d 20 ... 221 more bytes>,
387 verbose audit error pkgid: undefined
387 verbose audit error }
388 silly audit error Beginning October 4, 2021, all connections to npm websites and the npm registry - including for package installation - must use HTTPS and TLS 1.2 or higher.
388 silly audit error
388 silly audit error For more information see this blog post: https://github.blog/2021-08-23-npm-registry-deprecating-tls-1-0-tls-1-1/
389 timing auditReport:getReport Completed in 325ms
390 silly audit report null
391 timing reify:audit Completed in 325ms
392 verbose stack Error: aborted
392 verbose stack at connResetException (node:internal/errors:718:14)
392 verbose stack at TLSSocket.socketCloseListener (node:_http_client:456:19)
392 verbose stack at TLSSocket.emit (node:events:525:35)
392 verbose stack at node:net:320:12
392 verbose stack at TCP.done (node:_tls_wrap:588:7)
394 verbose Darwin 22.2.0
395 verbose node v18.13.0
396 verbose npm v9.4.0
397 error code ECONNRESET
398 error network aborted
399 error network This is a problem related to network connectivity.
399 error network In most cases you are behind a proxy or have bad network settings.
399 error network
399 error network If you are behind a proxy, please make sure that the
399 error network 'proxy' config is set properly. See: 'npm help config'
400 verbose exit 1
401 timing npm Completed in 43344ms
402 verbose unfinished npm timer command:init 1674780703163
403 verbose unfinished npm timer reify 1674780735103
404 verbose unfinished npm timer reify:unpack 1674780745902
405 verbose unfinished npm timer reifyNode:node_modules/tar 1674780745904
406 verbose unfinished npm timer reify:rollback:createSparse 1674780746457
407 verbose code 1
Node.js v18.13.0
npm --version 9.4.0
yarn 1.22.19

AWS-CDK returning maximum call stack size exceed when installing with npm

I'm getting an error when I run npm install -g aws-cdk it says Maximum call stack size exceeded if I don't do the global install then I don't get that error but my windows machine doesn't pick up that I have AWS-CDK installed then. The documentation also says to install globally.
Has anyone encountered this?
An important note I am using a company PC that sits behind a VPN. I can't however disconnect this from the VPN.
I'm running version 16.18.0 node and version 8.19.2 of npm
The log file where the error is:
37 verbose stack at resolve (node:path:158:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:21:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)
37 verbose stack at realpathCached (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\realpath.js:41:10)```
I had the same issue. My problem is that I work on a PC with roaming profiles where APPDATA is redirected to a server share. In my case changing the npm prefix directory solved the issue. Try the following:
npm config --global get prefix
In my case the output was: \\SRV02\Profiles\USERNAME_HERE\AppData\Roaming\npm
I changed it using the following command
npm config --global set prefix C:\tools\npm-prefix
then everything works. Remember to add C:\tools\npm-prefix to the PATH environment variable
This may be related to something in your global node_modules directory and not the AWS CDK. Try some answers to this question first.

Build failing with vue-notification package

I'm working on a project with vuepress and the vue-notification package. Everything is ok when I run the project locally with the vuepress dev command.
However, I get this error message when build the project:
> vuepress build docs
wait Extracting site metadata...
tip Apply theme #vuepress/theme-default ...
tip Apply plugin container (i.e. "vuepress-plugin-container") ...
tip Apply plugin #vuepress/register-components (i.e. "#vuepress/plugin-register-components") ...
tip Apply plugin #vuepress/active-header-links (i.e. "#vuepress/plugin-active-header-links") ...
tip Apply plugin #vuepress/search (i.e. "#vuepress/plugin-search") ...
tip Apply plugin #vuepress/nprogress (i.e. "#vuepress/plugin-nprogress") ...
✔ Client
Compiled successfully in 9.57s
✔ Server
Compiled successfully in 6.32s
wait Rendering static HTML...
error Error rendering /: false
undefined
error Error rendering /404.html: false
undefined
ReferenceError: document is not defined
at addStyle (node_modules/vue-notification/dist/index.js:1019:0)
at addStylesToDom (node_modules/vue-notification/dist/index.js:1003:0)
at module.exports (node_modules/vue-notification/dist/index.js:957:0)
at Object.<anonymous> (node_modules/vue-notification/dist/index.js:898:0)
at __webpack_require__ (node_modules/vue-notification/dist/index.js:30:0)
at Object.<anonymous> (node_modules/vue-notification/dist/index.js:204:0)
at __webpack_require__ (node_modules/vue-notification/dist/index.js:30:0)
at Object.<anonymous> (node_modules/vue-notification/dist/index.js:154:0)
at __webpack_require__ (node_modules/vue-notification/dist/index.js:30:0)
at server-bundle.js:6487:18
at server-bundle.js:6490:10
at webpackUniversalModuleDefinition (node_modules/vue-notification/dist/index.js:3:0)
at Object.<anonymous> (node_modules/vue-notification/dist/index.js:10:1)
at __webpack_require__ (webpack/bootstrap:25:0)
at Module.<anonymous> (server-bundle.js:13363:12)
at __webpack_require__ (webpack/bootstrap:25:0)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! test-vuepress-notification#1.0.0 build: `vuepress build docs`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the test-vuepress-notification#1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/joao/.npm/_logs/2021-04-13T13_35_49_588Z-debug.log
This is the content of the log file
0 info it worked if it ends with ok
1 verbose cli [ '/usr/bin/node', '/usr/bin/npm', 'run', 'build' ]
2 info using npm#6.14.12
3 info using node#v14.16.1
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle test-vuepress-notification#1.0.0~prebuild: test-vuepress-notification#1.0.0
6 info lifecycle test-vuepress-notification#1.0.0~build: test-vuepress-notification#1.0.0
7 verbose lifecycle test-vuepress-notification#1.0.0~build: unsafe-perm in lifecycle true
8 verbose lifecycle test-vuepress-notification#1.0.0~build: PATH: /usr/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/home/joao/test-vuepress-notification/node_modules/.bin:/usr/local/bin:/usr/bin:/bin:/usr/local/games:/usr/games
9 verbose lifecycle test-vuepress-notification#1.0.0~build: CWD: /home/joao/test-vuepress-notification
10 silly lifecycle test-vuepress-notification#1.0.0~build: Args: [ '-c', 'vuepress build docs' ]
11 silly lifecycle test-vuepress-notification#1.0.0~build: Returned: code: 1 signal: null
12 info lifecycle test-vuepress-notification#1.0.0~build: Failed to exec build script
13 verbose stack Error: test-vuepress-notification#1.0.0 build: `vuepress build docs`
13 verbose stack Exit status 1
13 verbose stack at EventEmitter.<anonymous> (/usr/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:332:16)
13 verbose stack at EventEmitter.emit (events.js:315:20)
13 verbose stack at ChildProcess.<anonymous> (/usr/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack at ChildProcess.emit (events.js:315:20)
13 verbose stack at maybeClose (internal/child_process.js:1048:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)
14 verbose pkgid test-vuepress-notification#1.0.0
15 verbose cwd /home/joao/test-vuepress-notification
16 verbose Linux 4.19.0-16-amd64
17 verbose argv "/usr/bin/node" "/usr/bin/npm" "run" "build"
18 verbose node v14.16.1
19 verbose npm v6.14.12
20 error code ELIFECYCLE
21 error errno 1
22 error test-vuepress-notification#1.0.0 build: `vuepress build docs`
22 error Exit status 1
23 error Failed at the test-vuepress-notification#1.0.0 build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]
And this is the information on my environment
Environment Info:
System:
OS: Linux 5.4 Debian GNU/Linux 10 (buster) 10 (buster)
CPU: (4) x64 Intel(R) Core(TM) i5-7200U CPU # 2.50GHz
Binaries:
Node: 14.16.0 - /usr/bin/node
Yarn: Not Found
npm: 6.14.11 - /usr/bin/npm
Browsers:
Chrome: Not Found
Firefox: Not Found
npmPackages:
#vuepress/core: 1.8.2
#vuepress/theme-default: 1.8.2
vuepress: ^1.8.2 => 1.8.2
npmGlobalPackages:
vuepress: Not Found
The repository that I have used to reproduce the error is available in https://github.com/joaohis/vuepress-vue-notification-issue
Am I importing and injecting the vue-notification package correctly?
Do vuepress and vue-notification are not compatible?
Thank you.
With the help of a colleague in Reddit, I figured out that this is a problem with server-side rendering. To cope with it, I have followed the vue-notification documentation resulting in this enhanceApp.js file
import Notifications from 'vue-notification/dist/ssr.js'
export default ({
Vue, // the version of Vue being used in the VuePress app
options, // the options for the root Vue instance
router, // the router instance for the app
siteData, // site metadata
isServer // is this enhancement applied in server-rendering or client
}) => {
Vue.use(Notifications)
// Import the conventional module for client-side render
if (!isServer) {
import('vue-notification/dist/index.js').then(module => {
Vue.use(module)
})
}
}
Now I can build the project without any problem.

Can't install material-ui/core for react-native 17.0.1

Would anyone be able to clarify as to why this is not installing as it should?
$ npm install #material-ui/core
Here are the logs:
...
29 http fetch GET 304 https://registry.npmjs.org/react 125ms (from cache)
30 timing idealTree Completed in 2086ms
31 timing command:install Completed in 2090ms
32 verbose stack Error: unable to resolve dependency tree
32 verbose stack at Arborist.[failPeerConflict] (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\arborist\build-ideal-tree.js:1011:25)
32 verbose stack at Arborist.[loadPeerSet] (C:\Program Files\nodejs\node_modules\npm\node_modules\#npmcli\arborist\lib\arborist\build-ideal-tree.js:991:36)
36 verbose node v15.0.0
37 verbose npm v7.0.2
38 error code ERESOLVE
39 error ERESOLVE unable to resolve dependency tree
40 error
41 error While resolving: [1mamazon-clone[22m#[1m0.1.0[22m
41 error Found: [1mreact[22m#[1m17.0.1[22m[2m[22m
41 error [2mnode_modules/react[22m
41 error [1mreact[22m#"[1m^17.0.1[22m" from the root project
41 error
41 error Could not resolve dependency:
41 error [35mpeer[39m [1mreact[22m#"[1m^16.8.0[22m" from [1m#material-ui/core[22m#[1m4.11.0[22m[2m[22m
41 error [2mnode_modules/#material-ui/core[22m
41 error [1m#material-ui/core[22m#"[1m*[22m" from the root project
41 error
41 error Fix the upstream dependency conflict, or retry
41 error this command with --force, or --legacy-peer-deps
41 error to accept an incorrect (and potentially broken) dependency resolution.
I got chuncks of the logs above that may tell what exactly is going on.
Looks like this post has your solution:
https://github.com/npm/cli/issues/2000. It looks like a recent issue with an eslint dependency

npm install error - setting dev env

trying set up dev env for kibana
i cloned kibana ; cd kibana
and run npm install
getting the following error :
C:\kibana>npm install
18 error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program
Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "elasticsearch"
19 error node v6.10.3
20 error npm v3.10.10
21 error code ELIFECYCLE
22 error kibana#6.0.0-alpha2 elasticsearch: `grunt esvm:dev:keepalive`
22 error Exit status 1
23 error Failed at the kibana#6.0.0-alpha2 elasticsearch script 'grunt esvm:dev:keepalive'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the kibana package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error grunt esvm:dev:keepalive
23 error You can get information on how to open an issue for this project with:
23 error npm bugs kibana
23 error Or if that isn't available, you can get their info via:
23 error npm owner ls kibana
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]