Every time I try to create a react app it gets stuck. This is what I see
┌────────────────────────────────────────────────────────────┐
│ npm update check failed │
│ Try running with sudo or get access │
│ to the local update config store via │
│ sudo chown -R $USER:$(id -gn $USER) C:\Users\alanp\.config │
└────────────────────────────────────────────────────────────┘
Creating a new React app in C:\Users\alanp\OneDrive\Desktop\Personal Projects\PictureDayAtl\my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
It will just stay there. I checked my project out and it does end up creating a my-app folder and a package.json, but thats about it. I have I have up to date node and npm. Ive tried installing react, react-dom, and react-scripts before hand but that doesnt work. Ive tried repeating this multiple times and nothing. Left it run for a couple hours and nothing. Any help would be appreciated.
Related
I have multiple React repos cloned from gitlab within my work folder. I want to implement a work-wide eslint configuration, whereby every project has the same eslint rules. As such, I want to first npm install eslint#7 --save-devevery repo (this repo comes with React best-practice eslint recommendations).
Is there way to npm install for every repo once from one folder above? I don't want to install it globally.
I will then use a bash script to add a eslintrc file to each repo at root level.
example of repos:
work dir
├── react-app-one
├── react-app-two
├── app-three
├── app-four
├── app-five
Look at npm workspaces since this does exactly what you ask for
I want to delete version 6.0.2.
npm list react-router-dom
zkzk1123#0.1.0 /Users/123/Desktop/
├─┬ #storybook/addon-links#6.4.8
│ └─┬ #storybook/router#6.4.8
│ └── react-router-dom#6.0.2
└── react-router-dom#5.3.0
I tried both npm uninstall react-router-dom, npm uninstall react-router-dom#6.0.2 but #5.3.0 is deleted but #6.0.2 is not, what should I do? I want to delete it.
Your question is not clear. Do you want to delete a version of npm or a version of react-router-dom? To delete a version of react-router-dom, I would suggest you run ‘’’npm uninstall react-router-dom’’’ and then install the required version by running ‘’’npm i react-router-dom#5.3.0’’’
If you are using vscode, you can directly search your folder for the react-router-dom#5.3.0 you should see it in a package.json file -> delete that line from the dependencies -> delete yarn.lock or npm.lock -> delete node_modules -> run npm install or yarn if using yarn
It's resolved.
After changing all #storybook libraries to #5 version, deleting node_modles and package-lock, and reinstalling with yarn , react-router-dom#6 was not installed.
npm uninstall react-router-dom
restart npm, finally
npm i react-router-dom
I am trying to follow this tutorial on https://storybook.js.org/tutorials/intro-to-storybook/react/en/get-started/
The commands that are given in the tutorial are as follows
# Clone the template
npx degit chromaui/intro-storybook-react-template taskbox
cd taskbox
# Install dependencies
yarn
# Run the test runner (Jest) in a terminal:
yarn test --watchAll
# Start the component explorer on port 6006:
yarn storybook
# Run the frontend app proper on port 3000:
yarn start
I am however running into an issue when yarn storybook on my wsl2 ubuntu terminal.
Here is the error
yarn storybook
yarn run v1.22.5
warning ../package.json: No license field
$ start-storybook -p 6006 -s public
info #storybook/react v6.3.0
info
info => Loading presets
info => Serving static files from ./public at /
info => Loading 1 config file in "/mnt/d/taskbox/.storybook"
info => Loading 9 other files in "/mnt/d/taskbox/.storybook"
info => Adding stories defined in "/mnt/d/taskbox/.storybook/main.js"
info => Using prebuilt manager
info => Loading Webpack configuration from `node_modules/react-scripts`
info => Removing existing JavaScript and TypeScript rules.
info => Modifying Create React App rules.
info => Using default Webpack4 setup
(node:7126) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./" in the "exports" field module resolution of the package at /mnt/d/taskbox/node_modules/postcss-safe-parser/node_modules/postcss/package.json.
Update this package.json to use a subpath pattern like "./*".
(Use `node --trace-deprecation ...` to show where the warning was created)
17% building 63/88 modules 25 active /mnt/d/taskbox/node_modules/global/window.jsBrowserslist: caniuse-lite is outdated. Please run:
npx browserslist#latest --update-db
Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating
webpack built preview 0ef1297f848efab9f24c in 139265ms
╭─────────────────────────────────────────────────────╮
│ │
│ Storybook 6.3.0 started │
│ 3.97 min for preview │
│ │
│ Local: http://localhost:6006/ │
│ On your network: http://172.22.229.210:6006/ │
│ │
│ A new version (6.3.6) is available! │
│ │
│ Upgrade now: npx sb#latest upgrade │
│ │
│ Read full changelog: https://git.io/fhFYe │
│ │
╰─────────────────────────────────────────────────────╯
node:internal/errors:456
ErrorCaptureStackTrace(err);
^
Error: spawn wslvar ENOENT
at Process.ChildProcess._handle.onexit (node:internal/child_process:282:19)
at onErrorNT (node:internal/child_process:480:16)
at processTicksAndRejections (node:internal/process/task_queues:83:21) {
errno: -2,
code: 'ENOENT',
syscall: 'spawn wslvar',
path: 'wslvar',
spawnargs: [ 'systemroot' ],
cmd: 'wslvar systemroot',
stdout: '',
stderr: ''
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
I've been having a hard time finding similar errors to go off of since it seems like a rare error. I suspect it's related to me running storybook on WSL2 though.
According to this Github comment, the error is usually caused by either:
powershell.exe not being in the path (unlikely, but could be the case if a /etc/wsl.conf explicitly disabled Windows PATH interop).
Missing wslvar, which is part of the wslu (WSL Utilities) package. While it's installed by default in some WSL distributions, it may not be up-to-date or installed in some. See the Github page for installation instructions for each distribution.
I run into a problem when installing gatsby plugins.
My Setup:
npm install -g gatsby-cli
gatsby new my-app
gatsby develop
When I try to install a plugin from the Gatsby library im getting this error message after installing the plugin:
Error: Invalid hook call. Hooks can only be called inside of the bo
dy of a function component. This could happen for one of the follow
ing reasons:
You might have mismatching versions of React and the renderer (s uch as React DOM)
You might be breaking the Rules of Hooks
You might have more than one copy of React in the same app See fb.me/react-invalid-hook-call for tips about how to deb ug and fix
this problem.
Is there something wrong with my dep tree?
├─┬ gatsby#2.23.10
│ └─┬ gatsby-cli#2.12.50
│ └── react#16.13.1 deduped
└── react#16.13.1
According to the comments above the solution was:
Removing node_modules and .cache folder, reinstalling dependencies via npm install and gatsby develop.
I try to run a REACT application on bluemix / IBMCloud which runs successful on my local workstation.
I get the error Module not found: Can't resolve 'watson-react-components'
when I invoke the application (deploy to bluemix is successful)
Here the import statement im my java script code
import React from 'react';
import './Conversation.css';
import { InputWithButton } from 'watson-react-components';
import Message from './Message.js';
I install the packagethe following install commands
# Install & build
npm install && npm install watson-react-components && npm run build
this is what I get during the installation of the packages
│ └── whatwg-fetch#2.0.3
└─┬ watson-react-components#0.6.16
├── map-range#0.1.2
├── numeral#2.0.6
├─┬ prismjs#1.11.0
│ └─┬ clipboard#1.7.1
│ ├─┬ good-listener#1.2.2
│ │ └── delegate#3.2.0
│ ├── select#1.1.2
│ └── tiny-emitter#2.0.2
Here the error message on the app
Failed to compile
./src/Conversation.js
Module not found: Can't resolve 'watson-react-components' in '/home/vcap/app/src'
sorry sorry --- the problem was sitting in front of the computer. I missed the cf push command in the deployment script.
Problem solved!!! sorry again
The bug is in the command to install the app.
It should be npm install && npm install --save watson-react-components && npm run build
You forgot a --save