When I try to run npm create-react-app <name>, I encounter error reports. I've tried updating my node.js/npm and several other things and just don't work.
as you see in the error message, you have to install the last version of Visual Studio, take a look at node-gyp README, there is a guide to install and configure the dependencies.
suggest: use the npx to initialize a new react project with CRA, this way you will install the latest version each time.
Related
I am having troubles on runnning a code online, it's the sliding image puzzle from this link: https://www.youtube.com/watch?v=_wdbhVvMOCs and here is the github from the video's description: https://github.com/danba340/react-sliding-puzzle
If I type in npm start, it shows
this error on the local host.
After running it on the VS Code, it shows
this error that says \node_modules\react-motion doesn't exist.
Whenever I try npm install --save react-motion , it shows
this error on the Visual Studio Code.
Please help me this is for my project thank you!
The reason is because the library doesn’t support react 17 yet.
Try by reinstalling your modules from scratch with the following:
rm -rf node_modules package-lock.json; npm i; npm i react-motion
If that doesn’t work, you’ll need to force the installation:
npm i react-motion —-legacy-peer-deps
If the library still have problems, you’ll then need to downgrade react to version 16 instead of 17 to make it work.
Last but not least, if you don’t want to downgrade, you can try to do the same by using yarn instead of npm
I was running my project finely, but I merge my code with other which contain a package called react-modal, after that my code doesn't work. I revert that code from my project, but it doesn't work, I can't even run my project. "cannot read properties of undefined" error is occuring. I upgrade all my packages like webpack, webpack cli etc, but it doesn't helps. What I need to do to run my project?
Well you can do two things here.
First to revert your code back to your latest code before merge.
Run the below command to delete Node_modules npm prune --production
and then run npm install and then build your project.
I have an issue that I cannot solve.
I'm using ESLint in VSCode for my all projects.
Now I created a new react app but when I run it (npm start or yarn start), it throws an error.
React app use ESLint 5.12.5, is lower version of mine.
I tried following the steps in the suggestion but ... it's not fixed.
Can anyone solve my issue?
I tried npm uninstall -g eslint, npm uninstall eslint, npm i ...bla..bla, removed my ESLint extension in my VSCode, and re-created react app. But the error has not been fixed.
I checked eslint -v, it said 5.14.1, but in the error notice, vscode said version 5.16.0 is in node-modules ##.
This is full error notice when I try yarn start or npm start:
> homework02#0.1.0 start E:\Extenal Code\Hoc JS\ReactJS-iViettech\homework02
> react-scripts start
There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.
The react-scripts package provided by Create React App requires a dependency:
"eslint": "5.12.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of eslint was detected higher up in the tree:
E:\Extenal Code\Hoc JS\node_modules\eslint (version: 5.16.0)
Manually installing incompatible versions is known to cause hard-to-debug issues.
If you would prefer to ignore this check, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That will permanently disable this message but you might encounter other issues.
To fix the dependency tree, try following the steps below in the exact order:
1. Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
2. Delete node_modules in your project folder.
3. Remove "eslint" from dependencies and/or devDependencies in the package.json file in your project folder.
4. Run npm install or yarn, depending on the package manager you use.
In most cases, this should be enough to fix the problem.
If this has not helped, there are a few other things you can try:
5. If you used npm, install yarn (http://yarnpkg.com/) and repeat the above steps with it instead.
This may help because npm has known issues with package hoisting which may get resolved in future versions.
6. Check if E:\Extenal Code\Hoc JS\node_modules\eslint is outside your project directory.
For example, you might have accidentally installed something in your home folder.
7. Try running npm ls eslint in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed eslint.
If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That would permanently disable this preflight check in case you want to proceed anyway.
I just solved this issue, the error says:
The react-scripts package provided by Create React App requires a dependency:
"eslint": "5.12.0" (in my case "^5.16.0")
but also says you have another version at package.json that's
E:\Extenal Code\Hoc JS\node_modules\eslint (version: 5.16.0) in my case was 6.1.0
so my solution was:
I searched for the dependency called eslint and updated the version similar to Create React App expected "eslint": "^5.12.0" (in my case "eslint": "^5.16.0") at package.json
Then run npm install and now you can run npm start... if you have troubles with slint-plugin-import just update the version as well, additional you can try installing locally instead of global with --save.
I believe this is an ongoing issue with create-react-app and eslint as detailed at:
https://github.com/wesbos/eslint-config-wesbos/issues/17
There are a number of suggestions there, though I'm hoping they will put a more permanent fix in place.
In my case it works like below:
Create New Project or clone form vcs.
Create .eslintrc.json file by yourself. Do not use Ctrl+Shift+P ->Eslint:create eslint configuration.
Try searching for eslint and change the version to the required version in the package.json file of eslint. 5.12.0 in your case.
Just try clearing cache and everything will come into normal usage you can use npx create-react-app project-folder-name, this worked for me.
Use this cmd in your terminal
cmd -> npm cache clean —force
there is different process to make it work just have to follow two installations for the future projects too if you like you can use this too and can work for your projects, cmd line is mentioned below :
cmd 1-> create-react-app my-app --scripts-version #nomoreanalog/react-scripts-eslintless
cmd 2-> npm install --save-dev babel-plugin-styled-components
I am coding with React Native. I don't see that when I first create react-native app for check running. When I implements my code see that. My purpose is generate apk.
app.json
build.gradle
index.js (index.android.json)
App package.json
Solved
Result: I solved my problem with npm install. I would like say many month after.
If anyone's getting this error after upgrading Expo, try restarting your simulator - that fixed it for me.
Here is my experience if someone using expo sees those error message.
I accidentally installed expo manually in my project which was version 29.0.0.
I was using version 28.0.0 of expo sdk, so it may have crashed inside.
What I did:
manually upgrade sdkVersion of app.json to 29.0.0.
change sdk version to 29.0.0 for react-native.
Had exactly the same error - fresh machine, fresh npm, only one version of expo installed.
Turns out, expo requires you to build it as an app before it can send it to the expo app properly (at least on Android). This is easiest done by:
Adding an "android" section to app.json, with the contents "package": "uk.co.yourcompany.yourpackagename" (this is required by android packages. It can be complete garbage, but should follow that format - a backwards domain name)
running expo build:android and following the instructions to sign up to expo's servers and build the app
then restarting expo start
Not sure if this is documented anywhere though, so may be a new thing?
Another thing to try is to move your node_modules folder away (or maybe delete it, up to you) and re-run npm install
According to the official tutorial: https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app.html
If you want to use expo in your application, you must create it in the following way
npm i -g create-react-native-app
create-react-native-app my-project
cd my-project
npm start
This will start the React Native packager and print a QR code. Open it in the Expo app to load your JavaScript.
as I see your code has files that are not necessary, such as build.gradle and index.js, the structure that create-react-native-app creates is different and easier to use
I was getting the same error after updating the expo-cli to version 3.0.6.
By looking at my package.json I noticed the expo-cli version installed on my computer is not the same as package.json. so I changed it to "expo-cli": "^3.0.6" and ran npm install || yarn, then the error disappeared!
I'm trying to create a React project in WebStorm 2016.3.1
It's asking me for a create-react-app but I have no idea what that is and I can't find any reference on Google.
What is it and where can I find the value?
You need to install create-react-app npm module, before you use this feature.
npm install -g create-react-app
You can read more about this feature on the official release blog of WebStorm.
Excerpt from the documentation :
Make sure that you have create-react-app installed globally on your computer, for that run npm install -g create-react-app. Then to start your new project, double click on the start task in the npm tasks tool window to run it. That’s it!
I had ie installed create-react-app globally using yarn and webstorm failed to find it. Then I used npm, not to mention globally and its working like a charm.
TL;DRNo need to install anything. Just enter npx create-react-app in the create-react-app field & it should work like a pycharm, I mean charm :)
Side note: npx is pre-bundled with npm since npm version 5.2.0.
I created webStrom react app following this steps.
Download node.js
Open command line console and type "npm install -g create-react-app"
Create react app project from web-storm.
Make sure you provided the correct file path of create-react-app , by default it is
installed in ~\AppData\Roaming\npm\node_modules\create-react-app
use
npm start: to start development server
If you are using asdf or any other tool to manage multiple versions of nodejs, you will need to set up the path to create-react-app manually
I'm on mac, so for me the path was
/Users/<USER>/.asdf/installs/nodejs/12.16.2/.npm/lib/node_modules/create-react-app