I'm just trying to do the first angular.js tutorial on the official website. When I try to run npm install from my project directory I get the following error.
My package.json file is given below.
{
"version": "0.0.0",
"private": true,
"name": "angular-phonecat",
"description": "A tutorial application for AngularJS",
"repository": "https://github.com/angular/angular-phonecat",
"license": "MIT",
"devDependencies": {
"karma": "^0.12.16",
"karma-chrome-launcher": "^0.1.4",
"karma-jasmine": "^0.1.5",
"protractor": "~1.0.0",
"http-server": "^0.6.1",
"tmp": "0.0.23",
"bower": "^1.3.1",
"shelljs": "^0.2.6"
},
"scripts": {
"postinstall": "bower install",
"prestart": "npm install",
"start": "http-server -a 0.0.0.0 -p 8000",
"pretest": "npm install",
"test": "node node_modules/karma/bin/karma start test/karma.conf.js",
"test-single-run": "node node_modules/karma/bin/karma start test/karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor test/protractor-conf.js",
"update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/##NG_LOADER_START##[\\s\\S]*\\/\\/##NG_LOADER_END##/, '//##NG_LOADER_START##\\n' + cat('bower_components/angular-loader/angular-loader.min.js') + '\\n//##NG_LOADER_END##', 'app/index-async.html');\""
}
}
Can someone help me to solve this problem. Thanks.
The messages are warnings, sometimes that just happens, and they often are uneeded anyway.
As long as the main components, Bower, Protractor, Karma etc are working, then I would try just carry on with the tutorial.
You can test they are working by running their commands, e.g.
./node_modules/.bin/bower help
But
I think one issue I had with npm and running those commands is that they dont just run like the angular tutorial says.
So where the tutorial says, run this:
protractor test/protractor-conf.js
You might have to modify the command to this
./node_modules/.bin/protractor test/protractor-conf.js
Same with bower, karma etc
e.g.
put this in front of the commands
./node_modules./bin
the ./ says run this as a script and the path is so you access the scripts in the node_modules/.bin directories
Update
If you want to run a karma test:
First, make sure you are in the root directory of the project
./node_modules/.bin/karma start test/karma.conf.js --single-run
Related
I'm using a parcel bundler instead of a react-scripts which uses npm run build-prod instead of npm run build but it doesn't create a build folder instead they all in a dist folder so i changed the deploy script in the package.json to "deploy": "gh-pages -d dist" instead of the standard "deploy": "gh-pages -d build" which will give an error saying build script is missing , after i tried deploying this to git hub pages but i get an empty screen
"scripts": {
"predeploy": "npm run build-prod",
"deploy": "gh-pages -d dist",
"clean": "rm dist/bundle.js",
"start": "parcel src/index.html",
"build-prod": "parcel build src/index.html"
},
"dependencies": {
"node-sass": "^7.0.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.3.0"
},
"devDependencies": {
"#babel/core": "^7.18.5",
"#babel/preset-env": "^7.18.2",
"#babel/preset-react": "^7.17.12",
"gh-pages": "^4.0.0",
"parcel-bundler": "^1.12.5",
"prettier": "^2.7.1"
}
According the the Parcel docs here, you need to specify the --dist-dir flag.
Change your "build-prod" script to this:
"build-prod": "parcel build src/index.html --dist-dir build"
Now the output directory for your parcel build will go to build instead of dist so you can change your "deploy" script back to this:
"deploy": "gh-pages -d build"
I have an electron/react application which works fine in development mode, but when it comes to building and packaging it gives this error when i run yarn electron-pack
$ build -mw
/bin/sh: build: command not found
error Command failed with exit code 127.
this happened after i installed some additional packages ( the packaging before that worked fine )
this is my scripts in package.json file :
"scripts": {
"start": "rescripts start",
"build": "rescripts build",
"test": "rescripts test",
"eject": "react-scripts eject",
"electron-dev": "concurrently \"BROWSER=none yarn start\" \"wait-on
http://localhost:3000 && electron .\"",
"postinstall": "electron-builder",
"preelectron-pack": "yarn build",
"electron-pack": "build -mw"
},
and this is the devDependencies
"devDependencies": {
"#rescripts/cli": "^0.0.16",
"#rescripts/rescript-env": "^0.0.14",
"concurrently": "^6.2.0",
"electron": "^13.1.8",
"electron-builder": "^22.11.7",
"typescript": "^4.3.5",
"wait-on": "^6.0.0"
}
a temporary solution that i found is removing node modules files and run npm install
rm -rf node_modules
npm install
Here is my package.json file and im trying to run command - 'npm run webpack'.
{
"name": "react-graphql2",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack",
"dev": "webpack-dev-server",
"dev-https": "webpack-dev-server --https",
"prettier": "prettier --write './{src,tests}/**/*.{ts,tsx,js,jsx,json,css,scss}'",
"start": "yarn run build",
"test": "jest --coverage",
"testDev": "jest"
When I run this command I get the below output and the package is built without issues-
laks2#1976190:~/projects/spa-test/react-graphql2$ npm run build
> react-graphql2#1.0.0 build /Users/laks/projects/spa-test/react-graphql2
> webpack
webpack.config.js
clean-webpack-plugin: /Users/laks/projects/spa-test/react-graphql2/dist/js/*.js has been removed.
Now, I move the same project to a different folder and run the same command, now I dont see the webpack.config.js being passed -
laks2#1976190:~/projects/spa-test/react-graphql2$ npm run build
> react-graphql2#1.0.0 build /Users/laks/projects/spa-test/react-graphql2
> webpack
clean-webpack-plugin: /Users/laks/projects/spa-test/react-graphql2/dist/js/*.js has been removed.
created my project with my app
This is the project.json file. That I have created
{
"name": "detox",
"version": "0.0.1",
"private": true,
"scripts": {
"ios": "react-native run-ios",
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"test:e2e":"navicotrackapp test",
"test:e2e:build":"navicotrackapp build"
},
"dependencies": {
"react": "16.6.1",
"react-native": "0.57.7"
},
"devDependencies": {
"babel-jest": "23.6.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.49.2",
"react-test-renderer": "16.6.1"
},
"jest": {
"preset": "react-native"
},
"detox": {
"configurations": {
"ios.sim.debug": {
"binaryPath": "ios/build/Build/Products/Debug-iphonesimulator/navicotrackapp.app",
"build": "xcodebuild -project ios/navicotrackapp.xcodeproj -scheme navicotrackapp -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build",
"type": "ios.simulator",
"name": "iPhone XR"
}
}
}
}
However. When I ran the test this was the out come:
Questions:
What did I do wrong
How do I fix it?
For those coming with yarn 127 error code problem
Take a look on https://github.com/reactstrap/reactstrap/issues/711
Most probably you just need to run in console yarn :)
Replace your scripts values with these, and try again:
"scripts": {
"ios": "react-native run-ios",
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"test:e2e":"npm run test",
"test:e2e:build":"npm run build" // THIS SCRIPT WILL STILL BREAK FOR YOU
},
The last two are the important ones!
You need to prefix a script command with npm run or yarn if the script references another script in your package.json.
So instead of a script calling navicotrackapp test it would call npm run test OR yarn test.
NOTE:
In you example it looks like the terminal is failing on the script navicotrackapp build. Know that you do not have a build script defined so if you replace the script with npm run build it will still fail. You'll need to add a build script in if you want it to work!
"scripts": {
"ios": "react-native run-ios",
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"build": // DO SOMETHING HERE!!!!,
"test:e2e":"npm run test",
"test:e2e:build":"npm run build"
},
Try below commands it works for me
$ npm install #ionic/app-scripts#latest --save-dev
$ ionic serve
Just use https://app.netlify.com/drop to deploy manually on Netlify
first run this command
npm run build
OR
yarn run build
Then drag and drop the build folder on the website above.
Try this, and please take care of the spaces.
It worked for me though. I added CI= in the capital before npm run build. Double-check if you did git add. , git commit -m "first commit" and git push -u origin before your final deployment.
If you run the Angular Phone Catalog Tutorial on Windows right now, you get this error:
d:\dev\angular-phonecat\node_modules\protractor\node_modules\selenium
net\index.js:48
interfaces[key].forEach(function(ipAddress) {
^
TypeError: Cannot call method 'forEach' of null
at getAddress
Basically:
selenium-webdriver is intentionally only looking at darwin and linux systems to find the local loopback address (typically 127.0.0.1). So it's not working on windows.
The workaround is to change the "chromeOnly" setting in test/protractor-conf.js from true to false:
exports.config = {
allScriptsTimeout: 11000,
seleniumAddress: 'http://localhost:4444/wd/hub',
chromeDriver: 'C:\\Users\\admin\\AppData\\Roaming\\npm\\node_modules\\protractor\\selenium',
chromeOnly: false, <-- this option was "true"
This is condensed from the work at
https://github.com/angular/protractor/issues/906
I suffered from this same issue, on windows 7 64bit & windows 7 32bit,
The chromeOnyl=true didn't work for me, I solved the issue by updating the version of protractor and karma in the package.json to the latest versions and explicitly add karma-cli dependency
Guessing it must be a bug in protractor on windows 7 resolve in the latest version.
->
"karma": "^0.12.16",
"karma-cli": "^0.0.4",
"protractor": "^1.0.0-rc",
eg so package json was
{
"version": "0.0.0",
"private": true,
"name": "angular-phonecat",
"description": "A tutorial application for AngularJS",
"repository": "https://github.com/angular/angular-phonecat",
"license": "MIT",
"devDependencies": {
"karma": "^0.12.16",
"karma-cli": "^0.0.4",
"protractor": "^1.0.0-rc",
"http-server": "^0.6.1",
"bower": "^1.3.1",
"shelljs": "^0.2.6"
},
"scripts": {
"postinstall": "bower install",
"prestart": "npm install",
"start": "http-server -p 8000",
"pretest": "npm install",
"test": "karma start test/karma.conf.js",
"test-single-run": "karma start test/karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor test/protractor-conf.js",
"update-index-async": "node -e \"require('shelljs/global'); sed('-i', /\\/\\/##NG_LOADER_START##[\\s\\S]*\\/\\/##NG_LOADER_END##/, '//##NG_LOADER_START##\\n' + cat('bower_components/angular-loader/angular-loader.min.js') + '\\n//##NG_LOADER_END##', 'app/index-async.html');\""
}
}
there's a bug issue ticket here -> https://github.com/angular/angular-phonecat/issues/176
hope this helps you
cheers
Zap