Why is npm start not working in react app? - reactjs

I tried to run npm start to a React app that it was working perfectly, but now for some reason is not working. The mesage I recive is the following:
Error: Cannot find module 'C:\Users\albat\Desktop\personal_projects\alba_virtual_cv\index.js'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
at Function.Module._load (internal/modules/cjs/loader.js:686:27)
at Function.Module.runMain (internal/modules/cjs/loader.js:1043:10)
at internal/main/run_main_module.js:17:11 {
code: 'MODULE_NOT_FOUND',
requireStack: []
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! alba_virtual_cv#1.0.0 start: `node index.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the alba_virtual_cv#1.0.0 start 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! C:\Users\albat\AppData\Roaming\npm-cache\_logs\2020-05-11T09_08_43_976Z-debug.log
And my package.json is the following:
{
"name": "alba_virtual_cv",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"debug": "^4.1.1"
},
"devDependencies": {},
"description": ""
}
Please I need help to run the application again.
Thank you.

Run this before starting the project:
npm -i
This installs missing packages

It just means something went wrong when dependencies were installed the first time.
I suggest doing these three steps:
npm install -g npm#latest to update npm because it is sometimes buggy.
rm -rf node_modules to remove the existing modules.
npm install to re-install the project dependencies.
This should fix the problem.

Related

`npm run storybook` failing on fresh react project

I ran npx sb init to install in a fresh React application created by npx create-teact-app blah
When I attempt to run npm run storybook I get the following errors
ModuleNotFoundError: Module not found: Error: Cannot find module 'E:\Development\avask\blah\node_modules\react-refresh\index.js'. Please verify that the package.json has a valid "main" entry
at E:\Development\avask\blah\node_modules\webpack\lib\Compilation.js:925:10
at E:\Development\avask\blah\node_modules\webpack\lib\NormalModuleFactory.js:401:22
at E:\Development\avask\blah\node_modules\webpack\lib\NormalModuleFactory.js:139:22
at _next0 (eval at create (E:\Development\avask\blah\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
at eval (eval at create (E:\Development\avask\blah\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:32:1)
at E:\Development\avask\blah\node_modules\react-dev-utils\ModuleNotFoundPlugin.js:136:17
at E:\Development\avask\blah\node_modules\case-sensitive-paths-webpack-plugin\index.js:158:9
at E:\Development\avask\blah\node_modules\case-sensitive-paths-webpack-plugin\index.js:113:7
at CaseSensitivePathsPlugin.fileExistsWithCase (E:\Development\avask\blah\node_modules\case-sensitive-paths-webpack-plugin\index.js:83:5)
at E:\Development\avask\blah\node_modules\case-sensitive-paths-webpack-plugin\index.js:106:10
at E:\Development\avask\blah\node_modules\case-sensitive-paths-webpack-plugin\index.js:67:5
at E:\Development\avask\blah\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:85:15
at processTicksAndRejections (internal/process/task_queues.js:77:11)
WARN Broken build, fix the error above.
WARN You may need to refresh the browser.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! blah#0.1.0 storybook: `start-storybook -p 6006 -s public`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the blah#0.1.0 storybook 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! C:\Users\TheBritishAreComing\AppData\Roaming\npm-cache\_logs\2021-10-04T15_59_44_158Z-debug.log
My package.json devDependencies are
"devDependencies": {
"#storybook/addon-actions": "^6.3.9",
"#storybook/addon-essentials": "^6.3.9",
"#storybook/addon-links": "^6.3.9",
"#storybook/node-logger": "^6.3.9",
"#storybook/preset-create-react-app": "^4.0.0",
"#storybook/react": "^6.3.9"
}
and I've done npm ls react-refresh it looks like it's being pulled in by #storybook/react#6.3.9
When i look at the package.json for node-modules/react-refresh
I see
"license": "MIT",
"main": "index.js",
"name": "react-refresh",
But there is no file "index.js" in the package folder, I understand the issue but not sure how I resolve it.
I've tried using an earlier version of storybook but the problem persists.
Looking through the react-refresh repo, it looks like this was fixed in a later version.
doing npm install --save-dev react-refresh resolved it

How do I fix npm missing script

PS C:\Users\LENOVO\Desktop\HTML PROJECTS\React\NewTodo-App> npm start
npm ERR! missing script: start
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\LENOVO\AppData\Roaming\npm-cache_logs\2021-09-05T09_29_42_788Z-debug.log
I keep getting that error each time I run npm start
go to your package . json and add this
"scripts": {
"start": "node index.js"
}

How do I fix a missing script error and npm start?

{
"name": "trelloclone-client",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"start": "node index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/hlee686/TrelloClone-client.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/hlee686/TrelloClone-client/issues"
},
"homepage": "https://github.com/hlee686/TrelloClone-client#readme",
"dependencies": {
"dependencies": "0.0.1",
"node_module": "0.0.0",
"start": "^5.1.0"
},
"devDependencies": {},
"description": ""
}
When I npm start, I get an error as below.
Jakes-MacBook-Air:TrelloClone-client jslee$ npm start
trelloclone-client#1.0.0 start /Users/jslee/Desktop/TrelloClone-client
index.js
sh: index.js: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! trelloclone-client#1.0.0 start: index.js
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the trelloclone-client#1.0.0 start 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! /Users/jslee/.npm/_logs/2020-04-09T10_18_00_148Z-debug.log
How can I fix it and run npm start?
Thank you
The above is my package.json file.
Not too sure where to start, but do you have Node and Npm correctly installed and on your path? Try the below using terminal in the same folder as the package.json file.
node --version
npm --version
If the above return a version number, as least you know that node and npm are fine.
Have you installed the dependencies?
Finally, what's in the index.js file? Have you tried a simple 'hello world' type index.js just to make sure things hang together?

ReactJS web application Permission error when deploy rty to build

I'm stuck at deploying my reactJS web application to Heroku.
It worked fine on the local machine. I got problems with permission when Build section runs.
I don't know what did I wrong, everything else in this course works fine.
I tried to deploy the app with GitHub connection, but I got the same error.
I tried to run this code in terminal NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client, but I got another error (NPM... is not a command).
my package.json file :
{
"name": "contactkeeper",
"version": "1.0.0",
"description": "Contact manager app",
"main": "server.js",
"engines": {
"node": "^12.4.0"
},
"scripts": {
"start": "node server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"clientinstall": "npm install --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
},
"keywords": [],
"author": "vinogitz",
"license": "ISC",
"dependencies": {
"bcryptjs": "^2.4.3",
"config": "^3.1.0",
"express": "^4.17.1",
"express-validator": "^6.1.1",
"jsonwebtoken": "^8.5.1",
"lodash.template": "^4.5.0",
"mongoose": "^5.6.3"
},
"devDependencies": {
"concurrently": "^4.1.1",
"nodemon": "^1.19.1"
}
}
my gitignore like this:
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
#client/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
-----> Build
Running heroku-postbuild
> contactkeeper#1.0.0 heroku-postbuild /tmp/build_5e4bd7bd79fb3c0f84bb21cb820d7594
> NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client
audited 902208 packages in 13.316s
found 0 vulnerabilities
> client#0.1.0 build /tmp/build_5e4bd7bd79fb3c0f84bb21cb820d7594/client
> react-scripts build
sh: 1: react-scripts: Permission denied
npm ERR! code ELIFECYCLE
npm ERR! errno 126
npm ERR! client#0.1.0 build: `react-scripts build`
npm ERR! Exit status 126
npm ERR!
npm ERR! Failed at the client#0.1.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! /tmp/npmcache.BWDxV/_logs/2019-07-22T11_55_03_878Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 126
npm ERR! contactkeeper#1.0.0 heroku-postbuild: `NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client`
npm ERR! Exit status 126
npm ERR!
npm ERR! Failed at the contactkeeper#1.0.0 heroku-postbuild 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! /tmp/npmcache.BWDxV/_logs/2019-07-22T11_55_03_893Z-debug.log
-----> Build failed
We're sorry this build is failing! You can troubleshoot common issues here:
https://devcenter.heroku.com/articles/troubleshooting-node-deploys
If you're stuck, please submit a ticket so we can help:
https://help.heroku.com/
Love,
Heroku
! Push rejected, failed to compile Node.js app.
! Push failed
I found the problem. the permission denied is not the perfect error message, but i found the solution.
I tried to ignore the node_modules folder in my client folder with .gitignore, but I didn't find the solution first time, so I just delete the sub folder node_modules from project. After that, I tried to deploy it again, and it's worked. So the real problem was that, the git add, git commit, git push commands pushed the node_modules sub folder to the repository.
PS.: The solution is: write node_modules/ instead of /node_modules in gitignore. With this the node_modules folders in a project (root folder or in a sub folder get untracked.)
Thanks!

Can't install #uirouter/angularjs via npm

Trying to install #uirouter/angularjs via npm, but getting the following error:
npm ERR! code E404
npm ERR! 404 Not Found: #uirouter/angularjs#1.0.12
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/anatolyt/.npm/_logs/2018-01-10T14_14_22_375Z-debug.log
I'm using node v8.9.1 and npm 5.6.0, I'm using nvm too. Using OSX High Sierra - latest.
My package.json file is as following:
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"dependencies": {
"#uirouter/angularjs":"1.0.12"
},
"author": "",
"license": "ISC"
}
As I suspected it was related to our private npm repository - sinopia, it was unable to resolve name which begins from #, #uirouter/angularjs, #angular/core, etc...
Thanks for our IT guy, he found a solution in this thread: Unable to resolve dependencies like "#angular/common", you need to issue locally:
npm config set "#angular:registry" http://registry.npmjs.org/
it will cause npm to bypass sinopia and go straight to the npmjs repository for all packages within #angular scope. You have to perform same for every scope.
Another permanent solution (untested yet) is to modify sinopia's code:
in sinopia/lib/up-storage.js
change code on line number 10
var encode = function(thing) {
return encodeURIComponent(thing).replace(/^%40/, '#');
};

Resources