I just got a Mac Mini M1 for personal use, and I'm trying to run a preexisting React app. I installed nodejs and npm successfully, and running npm install does add the node_modules folder correctly as far as I can tell; but whenever I run npm start or npm run <script>, I get an error. It seems that npm can't access any of the project's dependencies. I've tried this using the rosetta terminal as well with the same results.
For an example, I initialized a new React project with npx create-react-app test_app, then cded into it and ran npm start. I got:
test_repo#0.1.0 start
> react-scripts start
sh: react-scripts: command not found
How do I get these commands to run properly and launch the app?
Here's what I'm using for node and npm:
➜ test_repo npm -v
7.6.0
➜ test_repo node -v
v15.11.0
I found a (very) hacky solution for now. I'm no expert with npm, but what I discovered is that npm scripts refer to dependencies indirectly - for example, having a command that says
"test": "jest"
tells npm to look in node_modules/.bin for a file called jest and to run that.
the issue is something to do with npm understanding this. But it's possible to get around that by putting the address of each dependency in the script, for example:
"test" "node_modules/.bin/jest"
I was able to get things to build this way. If someone comes along with a better answer, please show me up :P
Related
The issue I have is that npm start cannot start. I tried to fix with audit, deleted node_dependency directory and re-installed with npm, nothing works.
One concrete issue I see is:
The react-scripts package provided by Create React App requires a dependency:
"webpack": "4.44.2"
Yet, I also see npm -v webpack -> 6.14.14. How do I need to debug this?
Your npm -v webpack command is not correct. it will return npm version and not the webpack version.
Try npm ls webpack . you can also check your package.json file for the packages you have. or run npm ls for the full list.
make sure to install the required dependency as it states.
Eventually I could not solve the package problem with an informed debugging.
What I did was to (npm install --global yarn) and start the application through it (yarn start). It worked a lot to download the packages and eventually started the application.
So, I guess I need to switch to yarn after this point, which is ok, as long as it works :)
I am using react native and Expo. I am unable to build new app because after I use expo init appName it shows the following error.
Heres the full message:
📦 Using npm to install packages. You can pass --yarn to use Yarn instead.
√ Downloaded and extracted project files.
× Something when wrong installing JavaScript dependencies. Check your npm logs. Continuing to initialize the app.
✅ Your project is ready!
To run your project, navigate to the directory and run one of the following npm commands.
- cd Scanner
- npm start # you can open iOS, Android, or web from here, or run them directly with the commands below.
- npm run android
- npm run ios # requires an iOS device or macOS for access to an iOS simulator
- npm run web
I tried multiple times to create a blank project, also tried npm install to install failed/not downloaded libraries and continue after failure but it showed another error:
npm ERR! code Z_BUF_ERROR
npm ERR! errno -5
npm ERR! zlib: unexpected end of file
also tried npm cache verify that showed cache is ok Content verified: 3562 (252580364 bytes).
So, How can I solve this issue?
Problems related to npm installation are very common If you do any mistake in early installation, but is avoided. Learn more about npm tree.
Steps worked for me are :
npm cache clean --force
npm cache verify
npm -g uninstall expo-cli --save
npm install expo-cli --global
expo init app-name
cd app-name
npm start
Always run as administrator if working on Windows and in root directory.
The solutions above didn't work for me but if you use 'npm install' in the directory of the app you get a clue that you shuold try 'npm install --force'
err message
You should have all these files folders and files at the start of the project otherwise not all the dependencies have been installed which is why we were getting the problem.folder structure
After you have added --force to npm install you have all the dependencies installed. Now you can run the app with npm start.
Unfortunately, all the solutions described above didn't work on my machine...
Here is my latest solution for this problem...
This worked 100% on my machine...
Use npm i -g expo-cli
This will automatically add the required packages and also remove the unnecessary ones.
Yes, surely, you don't need to uninstall and re-install it again.
Just follow my steps.
And, you can create your expo project using expo init.
I hope my solution will help you out from this annoying problem....
I just did npm install and it worked for me, but I had do that every time I create a new expo project.
I also encountered this problem, and finally found that it was the problem of react native cli，I installed the latest version of react native cli，Expo is back to normal
This Error is regarding to the git account. expos need a git account to setup react native project
If you are using windows you need to install git in your local PC
after that open your Terminal and type this command
git config --global user.name "your_username"
git config --global user.email "your_email_address#example.com"
after that clone any github project to your local computer. it will ask to login to Github
after all these steps try expo init <projectname>
The simple way to settle that error is by using "expo-cli init app-name" instead of "expo init app-name".
I tried and worked perfectly for me. Hope it will help you guys.
i have faced a similar problem and running yarn set version 1.22.1 fix it
Run the Command Prompt as an administrator. And run the following command:
npx create-expo-app AwesomeProject
Hi I need some clarification on npm materials.
What are the differences between "npm start" and "npm build"?
When do we use "run" for example, what are the differences between "npm test" and "npm run test"?
Thank you so much! I appreciate the explanation.
What you are finding is that there are some default scripts in NPM. Some of these are:
npm start
npm build
npm test
These are simply just aliases for npm run xxxx. To answer your question, npm run test and npm test are exactly the same. npm test is just a shorthand alias.
These default scripts are there to be used as kind of "universal" commands. For example: you have two different projects that have two different build processes. However, you could run npm build in both to build their respective build processes.
It depends on what you're using. In a react app npm start actually does npm run start but npm have allowed a shorthand version.
If you look in your package.json you'll see a scripts parameter that has all the things you can run using npm run [command]. You can define your own ones in there as well.
To answer your first question. The start and build commands are usually defined by webpack.
start is usually used to serve your app locally. So you can go to localhost and see it running.
build is used to compile your app into a folder, usually called dist/, into a flat html/CSS/JavaScript website so you can put the files onto a production server.
I am getting an error when trying to run npm run serve. At first I installed node.js then vue as well as vue/cli.
But when I am trying to run server as -> npm run serve at that time I'm getting error like 'vue-cli-service' is not recognized as an internal or external command.
I used below codes for installation:
npm install -g vue
npm install -g #vue/cli
can someone guide me what to do to solve this issue ?
I think you are using cmd in windows.
Try deleting the node_modules folder and after that run npm i from the cmd.
Then try running npm run serve again and see if it works this time
Install vue/cli-service globally
npm install #vue/cli-service -g
This will install global npm package.
#vue/cli-service is usully installed as global, because you do not usually copy these types of packages to every project.
If the global npm package gets corrupted, it is not stored in node_modules folder, but rather in other depending on the os. Therefore removing node_modules does not help. Locations for global node_modules folders are
%USERPROFILE%\AppData\Roaming\npm\node_modules (Win10) or
/usr/local/lib/node_modules (Linux),
check this stack overflow post on how to locate global packages.
it will depend on the package manager you are using
delete node_modules
if you are using yarn run yarn or yarn install and then yarn serve
if you are using npm run npm install and then npm run serve
In my case, the package #vue/cli-service is installed in my local node_modules environment, but not my global environment, so it cannot be used as a command. I type .\node_modules\.bin\vue-cli-service serve and it works.
As it is mentioned in terminal that node_modules is missing from your project, so you can't directly use npm run serve, first you have to do npm install then do npm run serve. It will work fine
In my case I ran below commands in GitBash and it worked fine
npm install
npm run serve
If you are using cmd in windows.
deleting the node_modules folder and after that run npm istall from
the cmd.
run npm run serve and see if it works this time
In my case, I have checked the folder of node_modules was missing. I am using Windows. So I run this in cmd.
npm install
npm run serve
Then I check it in localhost like usual.
This issue mostly happens when either #vue/cli is not installed or in most cases,
#vue/cli is already installed and you are currently working on a project and when running
yarn serve or npm run serve.
Most at times, this issue is been caused by broken dependencies.
to fix this issue, simple run
yarn install or npm install
depending on your package manager.
well after trying all the solutions above and it still haven't worked for you then you probably have a stupid space in the full directory of your Vue project like in my case. so remove that that space and it will work from then on.
Remember to set the NODE_ENV=development and run npm install again
Try changing the project path to one without spaces, it worked on windows 10
I had faced the same problem in windows. Then
first I deleted the node_module. then I run npm install.
For Windows you should modify package.json to:
"scripts": {
"serve": "vue-cli-service.cmd serve",
"build": "vue-cli-service.cmd build",
"lint": "vue-cli-service.cmd lint"
}
,
I had the same issue using windows + WSL2 (Ubuntu 20.04). Looking at the logs generated after trying to run npm i I noticed that my WSL2 environment did not have python2 installed. So to solve I ran the following commands:
sudo apt-get install python2
rm -rf node_modules
npm i
npm run serve
I faced the same in Windows. Had to run npm install again. Then it worked perfectly.
Wait, what's the difference between #vue/cli and #vue/cli-service? When you install both, they show different number of packages installed. The latter solved my issue actually but everyone keeps saying install #vue/cli.
try running npm i or npm install and then proceed to run npm i vue after previous installation done. works for me
you need use "npm install" at Command Line
Before running "npm install", try running this command first:
npm set strict-ssl false
Like you, I got the error below when I ran npm run serve from the CMD command line,
'vue-cli-service' is not recognized as an internal or external
command, operable program or batch file.
I got past this familiar error by using the following command to add the npm folder to the PATH that CMD searches for executables:
path=%path%;C:\Users\<USERNAME>\AppData\Roaming\npm
where <USERNAME> is your Windows user profile directory name. Only then was I able to run the following commands successfully:
npm install
npm run serve
What solved the issue for me was renaming the directory. I had used the symbol "&" on the folder name and it seems to break things, so changing it to "and" fixed the issue.
This will probably be an incredibly niche thing, but if I help even 1 person it's fine by me.
I have a project, I can run it well on Linux, but i have the same issue on windows, I solve it this way (I hope in your case it works too):
Delete the node_modules
Install it again with npm i
I followed the tutorial in the link here https://facebook.github.io/react-native/docs/getting-started.html#content . As it turns out, npm 5 is not supported yet. I tried installing npm 4 but, it is not working either. Stuck in the first page of the tutorial, when I run npm start, I am getting a bunch of errors too. Literally stuck, nowhere else to turn. Before voting down the question, kindly note that I am a mobile developer working with andorid and Ios having no previous knowledge about web technologies. Thanks
These are the steps I followed
npm install -g create-react-native-app
It was successfull, then,
create-react-native-app AwesomeProject
for this line, I got the following error
*******************************************************************************
ERROR: npm 5 is not supported yet
*******************************************************************************
It looks like you're using npm 5 which was recently released.
Create React Native App doesn't work with npm 5 yet, unfortunately. We
recommend using npm 4 or yarn until some bugs are resolved.
You can follow the known issues with npm 5 at:
https://github.com/npm/npm/issues/16991
*******************************************************************************
Then I ran the command
cd AwesomeProject
Afterwards I ran
npm start
for which I got the error
npm ERR! missing script: start
npm ERR! A complete log of this run can be found in:
npm ERR! /home/jayakrishnan/.npm/_logs/2017-07-25T08_13_06_277Z-debug.log
I tried using Yarn But didnt work
npm i -g npm#4.6.1 - then install create-react-native-app again and create a project.
Solution with Yarn:
First install Yarn
yarn global add create-react-native-app
cd AwesomeProject
yarn start
npm install -g npm#4 Use this to downgrade, Also use sudo with the commands, sometime it does give permission to write error and skips the installation
Try putting more information about the error so we can help, or steps to reproduce it.
One thing to try is to instead of using npm, use yarn. Install yarn with brew install yarn if you are on mac and do the same steps in the getting-started guide, except for use yarn run ios to start app in ios simulator.
I just tried with a fresh setup that this is working perfectly fine.
Reference to yarn https://yarnpkg.com/en/