Error while installing node modules in reactjs - node.js

Getting the below shown error I tried to install node modules using npm i command for my react js project
D:\Rev>npm i
> node-sass#4.12.0 install D:\Rev\node_modules\node-sass
> node scripts/install.js
Cached binary found at C:\Users\admin\AppData\Roaming\npm-cache\node-sass\4.12.0\win32-x64-64_binding.node
> node-sass#4.12.0 postinstall D:\Rev\node_modules\node-sass
> node scripts/build.js
Binary found at D:\Rev\node_modules\node-sass\vendor\win32-x64-64\binding.node
Testing binary
Binary is fine
> react-vertical-timeline-component#2.5.0 postinstall D:\Rev\node_modules\react-vertical-timeline-component
> node lib/post_install.js
> example-project#1.0.0 postinstall D:\Rev
> set NODE_ENV=production && npm run build-prod
> example-project#1.0.0 build-prod D:\Rev
> webpack --mode production --config webpack/webpack.production.config.js --progress --colors
D:\Rev\node_modules\webpack-cli\bin\config-yargs.js:89
describe: optionsSchema.definitions.output.properties.path.description,
^
TypeError: Cannot read property 'properties' of undefined
at module.exports (D:\Rev\node_modules\webpack-cli\bin\config-yargs.js:89:48)
at D:\Rev\node_modules\webpack-cli\bin\webpack.js:60:27
at Object.<anonymous> (D:\Rev\node_modules\webpack-cli\bin\webpack.js:515:3)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Module.require (internal/modules/cjs/loader.js:692:17)
at require (internal/modules/cjs/helpers.js:25:18)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! example-project#1.0.0 build-prod: `webpack --mode production --config webpack/webpack.production.config.js --progress --colors`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the example-project#1.0.0 build-prod 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\admin\AppData\Roaming\npm-cache\_logs\2019-09-27T08_52_21_812Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! example-project#1.0.0 postinstall: `set NODE_ENV=production && npm run build-prod`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the example-project#1.0.0 postinstall 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\admin\AppData\Roaming\npm-cache\_logs\2019-09-27T08_52_21_942Z-debug.log
The package.json is as follows:
{
"name": "example-project",
"version": "1.0.0",
"description": "",
"main": "bundle.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev-server": "set NODE_ENV=development && webpack-dev-server --mode development --config webpack/webpack.config.js --progress --colors",
"build": "set NODE_ENV=development && webpack --config webpack/webpack.production.config.js --progress --colors",
"build-prod": "webpack --mode production --config webpack/webpack.production.config.js --progress --colors",
"postinstall": "set NODE_ENV=production && npm run build-prod"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.26.3",
"babel-eslint": "^8.2.3",
"babel-loader": "^7.1.4",
"babel-preset-es2015": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"css-loader": "^0.28.11",
"eslint": "^4.19.1",
"eslint-loader": "^2.0.0",
"eslint-plugin-react": "^7.8.2",
"extract-text-webpack-plugin": "^4.0.0-beta.0",
"node-sass": "^4.9.0",
"react-collapsible": "^2.2.0",
"sass-loader": "^7.0.1",
"style-loader": "^0.21.0",
"webpack": "^4.8.3",
"webpack-cli": "^2.1.5",
"webpack-dev-server": "^3.1.4",
"webpack-merge": "^4.1.2"
},
"dependencies": {
"axios": "^0.18.0",
"babel-polyfill": "^6.26.0",
"babel-preset-react": "^6.24.1",
"classnames": "^2.2.5",
"dnd-core": "^3.0.2",
"file-loader": "^1.1.11",
"file-system": "^2.2.2",
"foundation-sites": "^6.4.3",
"gatsby-plugin-glamor": "^1.6.13",
"glamor": "^2.20.40",
"history": "^4.7.2",
"jquery": "^3.3.1",
"lodash": "^4.17.10",
"moment": "^2.22.1",
"qs": "^6.5.2",
"raf": "^3.4.1",
"rc-tree": "^1.11.4",
"react": "^16.3.2",
"react-autocomplete": "^1.8.1",
"react-column-resizer": "^1.1.8",
"react-datepicker": "^1.5.0",
"react-dialog": "^1.0.2",
"react-dnd": "^3.0.2",
"react-dnd-html5-backend": "^2.6.0",
"react-dom": "^16.3.2",
"react-dropzone": "^4.2.9",
"react-html-table-to-excel": "^2.0.0",
"react-idle-timer": "^3.0.0",
"react-js-pagination": "^3.0.2",
"react-redux": "^5.0.7",
"react-router": "^4.3.1",
"react-router-dom": "^4.3.1",
"react-router-redux": "^5.0.0-alpha.9",
"react-simple-dropdown": "^3.2.0",
"react-sortable-hoc": "^0.8.4",
"react-toastify": "^4.0.1",
"react-tooltip": "^3.10.0",
"react-transition-group": "^2.3.1",
"react-vertical-timeline-component": "^2.0.6",
"react-widgets": "^4.2.6",
"redux": "^3.7.2",
"redux-form": "^7.3.0",
"redux-thunk": "^2.2.0",
"uglifyjs-webpack-plugin": "^1.2.5",
"universal-cookie": "^2.1.2",
"url-loader": "^1.0.1"
}
}
How can I solve this issue?

Can you try to remove totally local node_modules
Then call
npm cache verify
or
npm cache clean
https://docs.npmjs.com/cli/cache.html
Then try to npm i again

Related

heroku sh: 1: tsc: not found

this my scripts
{
"name": "fullstack-apollo-express-boilerplate-project",
"version": "1.0.0",
"description": "",
"main": "index.ts",
"scripts": {
"tsc": "./node_modules/typescript/bin/tsc",
"build": "rimraf ./build && tsc",
"dev": "nodemon",
"start": "npm run build && node build/index.js",
"codegen": "graphql-codegen --config ./codegen.yml",
"lint": "eslint . --ext .ts",
"lint-and-fix": "eslint . --ext .ts --fix",
"prettier-format": "prettier --config .prettierrc src/**/*.ts --write"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"#graphql-codegen/cli": "^2.3.0",
"#graphql-codegen/typescript": "^2.4.1",
"#graphql-codegen/typescript-resolvers": "^2.4.2",
"#shopify/eslint-plugin": "^41.0.1",
"#types/bcryptjs": "^2.4.2",
"#types/cookie-parser": "^1.4.2",
"#types/mongoose-lean-virtuals": "^0.5.2",
"#types/nodemailer": "^6.4.4",
"#types/uuid": "^8.3.3",
"#typescript-eslint/eslint-plugin": "^5.5.0",
"#typescript-eslint/parser": "^5.5.0",
"eslint": "^8.4.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.25.3",
"eslint-plugin-prettier": "^4.0.0",
"nodemon": "^2.0.15",
"prettier": "^2.5.1",
"ts-node": "^10.4.0",
"typescript": "^4.5.2"
},
"dependencies": {
"#types/express": "^4.17.13",
"#types/node": "^16.11.11",
"apollo-server-core": "^3.5.0",
"apollo-server-express": "^3.5.0",
"bcryptjs": "^2.4.3",
"cookie-parser": "^1.4.6",
"cors": "^2.8.5",
"crypto-random-string": "3.3.1",
"dotenv": "^10.0.0",
"express": "^4.17.1",
"express-openid-connect": "^2.5.1",
"graphql": "^16.0.1",
"graphql-fields-list": "^2.2.4",
"graphql-parse-resolve-info": "^4.12.0",
"graphql-voyager": "^1.0.0-rc.31",
"i": "^0.3.7",
"jsonwebtoken": "^8.5.1",
"moment": "^2.29.1",
"mongoose": "^6.0.14",
"mongoose-lean-virtuals": "^0.9.0",
"nodemailer": "^6.7.2",
"rimraf": "^3.0.2"
}
}
when i do deploy i get error
2022-01-14T08:20:20.950719+00:00 app[web.1]: sh: 1: tsc: not found
2022-01-14T08:20:20.956238+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2022-01-14T08:20:20.956684+00:00 app[web.1]: npm ERR! syscall spawn
2022-01-14T08:20:20.956866+00:00 app[web.1]: npm ERR! file sh
2022-01-14T08:20:20.956950+00:00 app[web.1]: npm ERR! errno ENOENT
2022-01-14T08:20:20.961092+00:00 app[web.1]: npm ERR! fullstack-apollo-express-boilerplate-project#1.0.0 build: `rimraf ./build && tsc`
2022-01-14T08:20:20.961191+00:00 app[web.1]: npm ERR! spawn ENOENT
2022-01-14T08:20:20.961291+00:00 app[web.1]: npm ERR!
2022-01-14T08:20:20.961337+00:00 app[web.1]: npm ERR! Failed at the fullstack-apollo-express-boilerplate-project#1.0.0 build script.
2022-01-14T08:20:20.961377+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2022-01-14T08:20:20.961191+00:00 app[web.1]: npm ERR! spawn ENOENT
2022-01-14T08:20:20.961291+00:00 app[web.1]: npm ERR!
2022-01-14T08:20:20.961337+00:00 app[web.1]: npm ERR! Failed at the fullstack-apollo-express-boilerplate-project#1.0.0 build script.
2022-01-14T08:20:20.961377+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
I can't figure out what's the reason Everything works fine for me.
If you don't have a Procfile, Heroku will run your start script as a web process.
Your start script runs your build script, and your build script compiles your app using tsc:
"build": "rimraf ./build && tsc",
"start": "npm run build && node build/index.js",
// ^^^^^^^^^^^^^
This causes Heroku to try to compile your app every time your dyno starts, and since typescript is (correctly) a devDependency, tsc isn't available at runtime.
It doesn't make much sense to have your start script call your build script: your app only needs to be compiled once.
Modify your start script so it doesn't call your build script:
"build": "rimraf ./build && tsc",
"start": "node build/index.js",
Heroku automatically runs your build script at deploy time, and now it won't try to re-compile it at runtime.

ERROR TypeError: Cannot read property 'style-resources-loader' of undefined

I have a project with Vue 2.6, in which this error occurs at some stage of the style assembly (if I understand correctly). At the same time, I can neither build nor run the project, but all modules are successfully installed from the package.json
Error
ERROR TypeError: Cannot read property 'style-resources-loader' of undefined
Full detail:
ERROR TypeError: Cannot read property 'style-resources-loader' of undefined
TypeError: Cannot read property 'style-resources-loader' of undefined
at module.exports (/var/www/eskso.wsofter.ru/public_html/front/node_modules/vue-cli-plugin-style-resources-loader/index.js:2:53)
at /var/www/eskso.wsofter.ru/public_html/front/node_modules/#vue/cli-service/lib/Service.js:78:7
at Array.forEach (<anonymous>)
at Service.init (/var/www/eskso.wsofter.ru/public_html/front/node_modules/#vue/cli-service/lib/Service.js:76:18)
at Service.run (/var/www/eskso.wsofter.ru/public_html/front/node_modules/#vue/cli-service/lib/Service.js:215:10)
at Object.<anonymous> (/var/www/eskso.wsofter.ru/public_html/front/node_modules/#vue/cli-service/bin/vue-cli-service.js:36:9)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! sapphire#0.1.0 build: `vue-cli-service build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the sapphire#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! /root/.npm/_logs/2020-12-12T05_45_34_046Z-debug.log
root#bytebrush:/var/www/eskso.wsofter.ru/public_html/front#
package.json
...
"dependencies": {
"-": "0.0.1",
"axios": "^0.21.0",
"babel-polyfill": "^6.26.0",
"core-js": "^3.8.1",
"es6-promise": "^4.2.8",
"moment": "^2.29.1",
"scroll-lock": "^2.1.4",
"swiper": "^6.4.1",
"v-mask": "^2.2.3",
"v-tooltip": "^2.0.3",
"vee-validate": "^4.0.4",
"vue": "^2.6.12",
"vue-awesome-swiper": "^4.1.1",
"vue-axios": "^3.2.0",
"vue-click-outside": "^1.1.0",
"vue-cool-lightbox": "^2.6.9",
"vue-gtag": "^1.10.0",
"vue-recaptcha": "^1.3.0",
"vue-router": "^3.4.9",
"vue-select": "^3.10.8",
"vue-the-mask": "^0.11.1",
"vue-toasted": "^1.1.28",
"vue-yandex-maps": "^0.10.9",
"vue-yandex-metrika": "^1.8.3",
"vue2-perfect-scrollbar": "^1.5.0",
"vuejs-datepicker": "^1.6.2",
"vuelidate": "^0.7.6",
"vuex": "^3.6.0"
},
"devDependencies": {
"#vue/cli-plugin-babel": "~4.5.9",
"#vue/cli-plugin-eslint": "~4.5.9",
"#vue/cli-plugin-router": "~4.5.9",
"#vue/cli-plugin-vuex": "~4.5.9",
"#vue/cli-service": "~4.5.9",
"#vue/eslint-config-prettier": "^6.0.0",
"babel-eslint": "^10.1.0",
"css-loader": "^5.0.1",
"eslint": "^7.15.0",
"eslint-plugin-prettier": "^3.2.0",
"eslint-plugin-vue": "^7.2.0",
"less": "^3.12.2",
"less-loader": "^7.1.0",
"prettier": "^2.2.1",
"style-resources-loader": "^1.4.1",
"vue-cli-plugin-style-resources-loader": "~0.1.4",
"vue-svg-loader": "^0.16.0",
"vue-template-compiler": "^2.6.12"
}
...
style-resources-loader is for automatically importing certain resources. vue-cli-plugin-style-resources-loader is just a wrapper for that. There probably isn't a need for both, and that may be causing the problem. Try removing one of the following devDependencies:
vue-cli-plugin-style-resources-loader
style-resources-loader
For example:
npm uninstall vue-cli-plugin-style-resources-loader

Deployment to heroku [Error: spawn babel-node ENOENT]

Project works perfectly on dev machine. I've already spent more than 5 hours:
trying out different configurations using bash 'start' scripts on heroku remotely
installing babel-cli and babel-preset-env as dependencies instead of devDependencies
reading through heroku documentation about local builds, trying out
them
disabling dotenv in production
What are your suggestions / solution to this babel-node and heroku incompatibility? Maybe they're disabling it, since it makes more load on their server memory? I've written all my files in ES6 and I tried to rewrite them to old syntax, but that's almost impossible. Is there a way to make babel work on server-side for heroku?
Heroku application log:
2018-05-01T12:08:44.677261+00:00 heroku[web.1]: Starting process with command `npm start`
2018-05-01T12:08:47.873964+00:00 app[web.1]: [heroku-exec] Starting
2018-05-01T12:08:48.920661+00:00 app[web.1]:
2018-05-01T12:08:48.920707+00:00 app[web.1]: > rearn#1.0.0 start /app
2018-05-01T12:08:48.920710+00:00 app[web.1]: > cross-env NODE_ENV=production babel-node server/server.js
2018-05-01T12:08:48.920712+00:00 app[web.1]:
2018-05-01T12:08:49.196690+00:00 app[web.1]: events.js:183
2018-05-01T12:08:49.196703+00:00 app[web.1]: throw er; // Unhandled 'error' event
2018-05-01T12:08:49.196704+00:00 app[web.1]: ^
2018-05-01T12:08:49.196706+00:00 app[web.1]:
2018-05-01T12:08:49.196709+00:00 app[web.1]: Error: spawn babel-node ENOENT
2018-05-01T12:08:49.196710+00:00 app[web.1]: at _errnoException (util.js:1024:11)
2018-05-01T12:08:49.196712+00:00 app[web.1]: at Process.ChildProcess._handle.onexit (internal/child_process.js:190:19)
2018-05-01T12:08:49.196714+00:00 app[web.1]: at onErrorNT (internal/child_process.js:372:16)
2018-05-01T12:08:49.196717+00:00 app[web.1]: at _combinedTickCallback (internal/process/next_tick.js:138:11)
2018-05-01T12:08:49.196718+00:00 app[web.1]: at process._tickCallback (internal/process/next_tick.js:180:9)
2018-05-01T12:08:49.196720+00:00 app[web.1]: at Function.Module.runMain (module.js:678:11)
2018-05-01T12:08:49.196721+00:00 app[web.1]: at startup (bootstrap_node.js:187:16)
2018-05-01T12:08:49.196723+00:00 app[web.1]: at bootstrap_node.js:608:3
2018-05-01T12:08:49.206967+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2018-05-01T12:08:49.208660+00:00 app[web.1]: npm ERR! errno 1
2018-05-01T12:08:49.211774+00:00 app[web.1]: npm ERR! rearn#1.0.0 start: `cross-env NODE_ENV=production babel-node server/server.js`
2018-05-01T12:08:49.212391+00:00 app[web.1]: npm ERR! Exit status 1
2018-05-01T12:08:49.212731+00:00 app[web.1]: npm ERR!
2018-05-01T12:08:49.212944+00:00 app[web.1]: npm ERR! Failed at the rearn#1.0.0 start script.
2018-05-01T12:08:49.213151+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2018-05-01T12:08:49.220087+00:00 app[web.1]:
2018-05-01T12:08:49.220400+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2018-05-01T12:08:49.220579+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2018-05-01T12_08_49_214Z-debug.log
2018-05-01T12:08:49.315806+00:00 heroku[web.1]: State changed from starting to crashed
2018-05-01T12:08:49.301459+00:00 heroku[web.1]: Process exited with status 1
package.json:
{
"name": "rearn",
"version": "1.0.0",
"description": "",
"main": "index.js",
"engines": {
"node": "8.9.3",
"npm": "5.6.0"
},
"scripts": {
"build": "next build",
"start": "cross-env NODE_ENV=production babel-node server/server.js",
"test": "eslint pages components lib",
"dev": "nodemon server/server.js --watch server --exec babel-node server/server.js",
"port": "cross-env PORT=4000 npm start",
"prod": "yarn build && cross-env NODE_ENV=production babel-node server/server.js",
"precommit": "yarn test",
"prepush": "yarn test",
"heroku-postbuild": "YARN_PRODUCTION=false yarn install && yarn build"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"#zeit/next-sass": "^0.1.2",
"axios": "^0.18.0",
"bootstrap": "4.0.0",
"bootstrap-material-design": "^4.1.1",
"connect-mongo": "^2.0.1",
"cross-env": "^5.1.4",
"dotenv": "^5.0.1",
"express": "^4.16.3",
"express-session": "^1.15.6",
"express-useragent": "^1.0.12",
"jquery": "^3.3.1",
"material-ui": "^0.20.0",
"mongoose": "^5.0.15",
"next": "5.1.0",
"next-offline": "^2.5.0",
"next-redux-wrapper": "^1.3.5",
"node-sass": "^4.8.3",
"passport": "^0.4.0",
"passport-google-oauth": "^1.0.0",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-popper": "^0.10.1",
"react-redux": "^5.0.7",
"react-reveal": "^1.2.1",
"react-transition-group": "^2.3.0",
"redux": "^4.0.0",
"redux-form": "^7.3.0",
"redux-thunk": "^2.2.0",
"styled-jsx": "^2.2.6",
"workbox-background-sync": "^3.0.1"
},
"browserslist": [
"> 1%"
],
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-preset-env": "^1.6.1",
"eslint": "4.9.0",
"eslint-config-airbnb": "16.1.0",
"eslint-plugin-compat": "^2.2.0",
"eslint-plugin-import": "2.7.0",
"eslint-plugin-jsx-a11y": "6.0.2",
"eslint-plugin-react": "7.4.0",
"husky": "^0.14.3"
}
}
Solved. Actually I was removing and installing babel-cli and babel-preset-env in bash and somehow heroku didn't update package.json remotely? Why? Solution:
installing babel-cli and babel-preset-env as dependencies instead of
devDependencies (actually babel-cli only is enough for next.js, as it uses latest babel config).
Found this post, since i had a similar problem.
moved the whole block of
"#babel/cli": "7.5.5",
"#babel/core": "7.5.5",
"#babel/node": "7.5.5",
"#babel/plugin-transform-runtime": "7.5.5",
"#babel/preset-env": "7.5.5",
"#babel/runtime": "7.5.5",
from devDepenencies to the dependencies section of package.json = problem solved for now, maybe not the final perfect solution, tough

MEAN NPM Cannot find module 'webpack/lib/optimize/CommonsChunkPlugin' Error

I am having a little bit of problem upgrading to latest webpack. I have already checked the following threads and found that the cause of the error is a deprecated class.
Webpack migration 3 -> 4: Error: Cannot find module 'webpack/lib/optimize/CommonsChunkPlugin'
Webpack 4 migration CommonsChunkPlugin
The only problem is that I am not using this class in my code but even though I updated it, webpack itself is referencing it somewhere.
Note: I have already tried removing the node_modules, clearing cache and reinstalling
I generated the package.json through MEAN and the start script that is in the package.json use is referencing a bunch of webpack scripts which might be the issue.
One thing that is interesting is the following warning, tho, I am not sure if it is related:
preload-webpack-plugin#2.3.0 requires a peer of webpack#^3.2.0 but none is installed. You must install peer dependencies yourself.
It is saying a version higher then 3.2.0 is required (I have 4.2.0). I am not sure if it is because it is not recognizing the WebpackV4 or if V4 is just not backward compatible
current node version: 9.8.0
I appreciate any ideas/suggestions. package.json and the full error is below. Please let me know if I can provide any further info
[0] > Mean#2.0.1 server:dev /Users/Sinan/Desktop/cllctroffcl
[0] > npm run webpack-dev-server -- --config config/webpack.dev.js --open --
progress --profile --watch --content-base src/
[0]
[0]
[0] > Mean#2.0.1 webpack-dev-server /Users/Sinan/Desktop/cllctroffcl
[0] > node --max_old_space_size=4096 node_modules/webpack-dev-
server/bin/webpack-dev-server.js "--config" "config/webpack.dev.js" "--open" "--progress" "--profile" "--watch" "--content-base" "src/"
[0]
[1] PC listening on 8888
[0] module.js:545
[0] throw err;
[0] ^
[0]
[0] Error: Cannot find module 'webpack/lib/optimize/CommonsChunkPlugin'
[0] at Function.Module._resolveFilename (module.js:543:15)
[0] at Function.Module._load (module.js:470:25)
[0] at Module.require (module.js:593:17)
[0] at require (internal/module.js:11:18)
[0] at Object.<anonymous>
(/Users/Sinan/Desktop/cllctroffcl/config/webpack.common.js:16:28)
[0] at Module._compile (module.js:649:30)
[0] at Object.Module._extensions..js (module.js:660:10)
[0] at Module.load (module.js:561:32)
[0] at tryModuleLoad (module.js:501:12)
[0] at Function.Module._load (module.js:493:3)
[0] npm ERR! code ELIFECYCLE
[0] npm ERR! errno 1
[0] npm ERR! Mean#2.0.1 webpack-dev-server: `node --max_old_space_size=4096
node_modules/webpack-dev-server/bin/webpack-dev-server.js "--config"
"config/webpack.dev.js" "--open" "--progress" "--profile" "--watch" "--
content-base" "src/"`
[0] npm ERR! Exit status 1
[0] npm ERR!
npm ERR! Failed at the Mean#2.0.1 webpack-dev-server script.
[0] npm ERR! This is probably not a problem with npm. There is likely
additional logging output above.
[0]
[0] npm ERR! A complete log of this run can be found in:
[0] npm ERR! /Users/Sinan/.npm/_logs/2018-03-26T03_43_37_514Z-debug.log
[0] npm ERR! code ELIFECYCLE
[0] npm ERR! errno 1
[0] npm ERR! Mean#2.0.1 server:dev: `npm run webpack-dev-server -- --config
config/webpack.dev.js --open --progress --profile --watch --content-base
src/`
[0] npm ERR! Exit status 1
[0] npm ERR!
[0] npm ERR! Failed at the Mean#2.0.1 server:dev script.
npm ERR! This is probably not a problem with npm. There is likely additional
logging output above.
[0]
[0] npm ERR! A complete log of this run can be found in:
[0] npm ERR! /Users/Sinan/.npm/_logs/2018-03-26T03_43_37_532Z-debug.log
[0] npm run server:dev exited with code 1
Package.json
{
"name": "Mean",
"version": "2.0.1",
"description": "A MEAN stack framework using Angular Webpack Starter kit - featuring Angular (Router, Http, Forms, Services, Tests, E2E, Coverage), Karma, Protractor, Jasmine, Istanbul, TypeScript, and Webpack",
"keywords": [
"angular",
"angular2",
"angular4",
"webpack",
"typescript"
],
"author": "Lior Kesos <lior#linnovate.net>",
"homepage": "http://mean.io",
"license": "MIT",
"scripts": {
"build:aot:prod": "npm run clean:dist && npm run clean:aot && cross-env BUILD_AOT=1 npm run webpack -- --config config/webpack.prod.js --progress --profile --bail",
"build:aot": "npm run build:aot:prod",
"build:dev": "npm run clean:dist && npm run webpack -- --config config/webpack.dev.js --progress --profile",
"build:docker": "npm run build:prod && docker build -t angular2-webpack-start:latest .",
"build:prod": "npm run clean:dist && npm run webpack -- --config config/webpack.prod.js --progress --profile --bail",
"build": "npm run build:dev",
"ci:aot": "npm run lint && npm run test && npm run build:aot && npm run e2e",
"ci:jit": "npm run lint && npm run test && npm run build:prod && npm run e2e",
"ci:nobuild": "npm run lint && npm test && npm run e2e",
"ci:testall": "npm run lint && npm run test && npm run build:prod && npm run e2e && npm run build:aot && npm run e2e",
"ci:travis": "npm run lint && npm run test && npm run build:aot && npm run e2e:travis",
"ci": "npm run ci:testall",
"clean:dll": "npm run rimraf -- dll",
"clean:aot": "npm run rimraf -- compiled",
"clean:dist": "npm run rimraf -- dist",
"clean:install": "npm set progress=false && npm install",
"clean": "npm cache clean && npm run rimraf -- node_modules doc coverage dist compiled dll",
"docker": "docker",
"docs": "npm run typedoc -- --options typedoc.json --exclude '**/*.spec.ts' ./src/",
"e2e:live": "npm-run-all -p -r server:prod:ci protractor:live",
"e2e:travis": "npm-run-all -p -r server:prod:ci protractor:delay",
"e2e": "npm-run-all -p -r server:prod:ci protractor",
"github-deploy:dev": "npm run webpack -- --config config/webpack.github-deploy.js --progress --profile --env.githubDev",
"github-deploy:prod": "npm run webpack -- --config config/webpack.github-deploy.js --progress --profile --env.githubProd",
"github-deploy": "npm run github-deploy:dev",
"lint": "npm run tslint \"src/**/*.ts\"",
"node": "node",
"postinstall": "npm run webdriver:update",
"postversion": "git push && git push --tags",
"preclean:install": "npm run clean",
"preversion": "npm test",
"protractor": "protractor",
"protractor:delay": "sleep 3 && npm run protractor",
"protractor:live": "protractor --elementExplorer",
"rimraf": "rimraf",
"server:dev:hmr": "npm run server:dev -- --inline --hot",
"server:dev": "npm run webpack-dev-server -- --config config/webpack.dev.js --open --progress --profile --watch --content-base src/",
"server:prod": "http-server dist -c-1 --cors",
"server:prod:ci": "http-server dist -p 3000 -c-1 --cors",
"server": "npm run server:dev",
"start:hmr": "npm run server:dev:hmr",
"start": "concurrently \"npm run server:dev\" \"nodemon --watch server server-start.js\" ",
"start:prod": "NODE_ENV=production node server-start.js",
"test": "npm run lint && karma start",
"tslint": "tslint",
"typedoc": "typedoc",
"version": "npm run build",
"watch:dev:hmr": "npm run watch:dev -- --hot",
"watch:dev": "npm run build:dev -- --watch",
"watch:prod": "npm run build:prod -- --watch",
"watch:test": "npm run test -- --auto-watch --no-single-run",
"watch": "npm run watch:dev",
"webdriver-manager": "webdriver-manager",
"webdriver:start": "npm run webdriver-manager start",
"webdriver:update": "webdriver-manager update",
"webpack-dev-server": "node --max_old_space_size=4096 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
"webpack": "node --max_old_space_size=4096 node_modules/webpack/bin/webpack.js"
},
"dependencies": {
"#angular/animations": "~5.2.9",
"#angular/cdk": "~5.2.4",
"#angular/common": "^5.0.0",
"#angular/compiler": "~5.2.9",
"#angular/core": "^5.0.0",
"#angular/forms": "~5.2.9",
"#angular/http": "~5.2.9",
"#angular/material": "~5.2.4",
"#angular/platform-browser": "~5.2.9",
"#angular/platform-browser-dynamic": "~5.2.9",
"#angular/platform-server": "~5.2.9",
"#angular/router": "~5.2.9",
"#angularclass/hmr": "~2.1.3",
"#angularclass/hmr-loader": "~3.0.2",
"#ng-select/ng-select": "^0.30.1",
"#reactivex/rxjs": "^5.4.3",
"angular-in-memory-web-api": "~0.6.0",
"angular2-universal": "2.1.0-rc.1",
"apollo-angular": "^1.0.1",
"apollo-client": "^1.4.2",
"app-root-path": "^2.0.1",
"babel-cli": "^6.24.1",
"body-parser": "^1.17.2",
"casual": "^1.5.14",
"cookie-parser": "^1.4.3",
"core-js": "^2.4.1",
"cors": "^2.8.3",
"dotenv": "^5.0.1",
"express": "^4.15.3",
"express-graphql": "^0.6.6",
"express-jwt": "^5.3.0",
"express-validation": "^1.0.2",
"express-winston": "^2.4.0",
"graphql": "^0.13.2",
"graphql-server-express": "latest",
"graphql-tag": "^2.2.2",
"graphql-tools": "^2.23.1",
"hammerjs": "^2.0.8",
"helmet": "^3.6.1",
"hll": "^1.1.0",
"http-server": "^0.11.1",
"http-status": "^1.0.1",
"ie-shim": "^0.1.0",
"innograph": "git://github.com/linnovate/innograph.git#devel",
"joi": "^13.1.2",
"jsonwebtoken": "^8.1.0",
"long": "^4.0.0",
"material": "^0.2.6",
"method-override": "^2.3.9",
"mongoose": "^5.0.11",
"mongoose-double": "0.0.1",
"morgan": "^1.8.2",
"ng2-go-top-button": "^4.1.0",
"ngx-carousel": "^1.3.5",
"passport": "^0.4.0",
"passport-local": "^1.0.0",
"preboot": "^5.0.0-rc.10",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"reflect-metadata": "^0.1.10",
"rxjs": "^5.4.3",
"sockjs-client": "^1.1.4",
"winston": "^2.3.1",
"zone.js": "latest"
},
"devDependencies": {
"#angular/compiler-cli": "~5.2.9",
"#ngtools/webpack": "^1.10.2",
"#types/hammerjs": "^2.0.34",
"#types/jasmine": "2.8.6",
"#types/node": "^9.6.0",
"#types/source-map": "^0.5.0",
"#types/uglify-js": "^3.0.0",
"#types/webpack": "^4.1.2",
"add-asset-html-webpack-plugin": "^2.1.3",
"angular2-template-loader": "^0.6.2",
"assets-webpack-plugin": "^3.5.1",
"awesome-typescript-loader": "~4.0.1",
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-plugin-syntax-async-functions": "^6.13.0",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.23.0",
"babel-polyfill": "^6.23.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-es2017": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-register": "^6.24.1",
"codelyzer": "~4.2.1",
"concurrently": "^3.4.0",
"copy-webpack-plugin": "^4.0.1",
"cross-env": "^5.0.0",
"css-loader": "^0.28.0",
"exports-loader": "^0.7.0",
"expose-loader": "^0.7.3",
"extract-text-webpack-plugin": "~3.0.2",
"file-loader": "^1.1.11",
"find-root": "^1.0.0",
"gh-pages": "^1.1.0",
"html-webpack-plugin": "^3.1.0",
"imports-loader": "^0.8.0",
"inline-manifest-webpack-plugin": "^3.0.1",
"istanbul-instrumenter-loader": "3.0.0",
"jasmine-core": "^3.1.0",
"json-loader": "^0.5.4",
"karma": "^2.0.0",
"karma-chrome-launcher": "^2.0.0",
"karma-coverage": "^1.1.1",
"karma-jasmine": "^1.1.0",
"karma-mocha-reporter": "^2.2.3",
"karma-remap-coverage": "^0.1.4",
"karma-sourcemap-loader": "^0.3.7",
"karma-webpack": "~3.0.0",
"ng-router-loader": "^2.1.0",
"ngc-webpack": "~4.1.2",
"node-sass": "^4.5.2",
"nodemon": "^1.11.0",
"npm-run-all": "^4.0.2",
"optimize-js-plugin": "0.0.4",
"parse5": "^4.0.0",
"preload-webpack-plugin": "^2.3.0",
"protractor": "^5.1.1",
"raw-loader": "0.5.1",
"rimraf": "~2.6.1",
"sass-loader": "^6.0.3",
"script-ext-html-webpack-plugin": "^2.0.1",
"source-map-loader": "^0.2.1",
"string-replace-loader": "~2.1.1",
"style-loader": "~0.20.3",
"to-string-loader": "^1.1.5",
"ts-node": "~5.0.1",
"tslib": "^1.6.1",
"tslint": "~5.9.1",
"tslint-loader": "^3.5.2",
"typedoc": "^0.11.1",
"typescript": "~2.7.2",
"url-loader": "~1.0.1",
"webpack": "~4.2.0",
"webpack-cli": "^2.0.13",
"webpack-dev-middleware": "~3.0.1",
"webpack-dev-server": "^3.1.1",
"webpack-dll-bundles-plugin": "^1.0.0-beta.5",
"webpack-merge": "~4.1.0"
},
"repository": {
"type": "git",
"url": "https://github.com/AngularClass/angular-starter.git"
},
"bugs": {
"url": "https://github.com/AngularClass/angular-starter/issues"
},
"engines": {
"node": ">= 4.2.1",
"npm": ">= 3"
}
}
I just realized this was not a very well thought question however since other people might run into this I will keep the question up.
The problem is that config/webpack.common.js is out of date and tries to call on this deprecated class.
For a temporary work around is to comment out the following sections from config/webpack.common.js
const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin');
const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin');
AND
new CommonsChunkPlugin({
name: 'vendor',
chunks: ['main'],
minChunks: module => /node_modules/.test(module.resource)
}),
new ScriptExtHtmlWebpackPlugin({
sync: /polyfill|vendor/,
defaultAttribute: 'async',
preload: [/polyfill|vendor|main/],
prefetch: [/chunk/]
As of webpack4, tsConfigPath, is required to be specified.
You will also need to go under
ngcWebpack.NgcWebpackPlugin
and add
tsConfigPath: 'tsconfig.webpack.json',
ScriptExtHtmlWebpack seems to be an external library they use, which is also broken under webpack 4.
Note: Obviously commenting out all these things will have effects on your project. Just want to repeat once again that this is a temporary work around if you absolutely must use web pack 4.
I created a feature request that you can track here
Hopefully the config file will be updated as the transition to MEAN 2 takes place
Hope this helps

node.js jenkins npm install fails

I've been following the instructions here: http://code.tutsplus.com/tutorials/setting-up-continuous-integration-continuous-deployment-with-jenkins--cms-21511
When I create the production droplet all goes well. The new node.js works great and the npm install works.
When, however, I create the jenkins droplet, jenkins comes up fine, but the auto-install of the git package stops when it tries to find bower.
My package.json says:
{
"name": "mean",
"description": "Full-Stack JavaScript with MongoDB, Express, AngularJS, and Node.js",
"version": "0.0.1",
"engines": {
"node": "0.10.x",
"npm": "1.4.x"
},
"scripts": {
"start": "grunt",
"test": "grunt test",
"postinstall": "bower install --config.interactive=false"
},
"dependencies": {
"express": "~4.10.1",
"express-session": "~1.9.1",
"body-parser": "~1.9.0",
"cookie-parser": "~1.3.2",
"compression": "~1.2.0",
"method-override": "~2.3.0",
"morgan": "~1.4.1",
"connect-mongo": "~0.4.1",
"connect-flash": "~0.1.1",
"helmet": "~0.5.0",
"consolidate": "~0.10.0",
"swig": "~1.4.1",
"mongoose": "~3.8.8",
"passport": "~0.2.0",
"passport-local": "~1.0.0",
"passport-facebook": "~1.0.2",
"passport-twitter": "~1.0.2",
"passport-linkedin": "~0.1.3",
"passport-google-oauth": "~0.1.5",
"passport-github": "~0.1.5",
"lodash": "~2.4.1",
"forever": "~0.11.0",
"bower": "~1.3.8",
"grunt-cli": "~0.1.13",
"glob": "~4.0.5",
"async": "~0.9.0",
"nodemailer": "~1.3.0",
"chalk": "~0.5",
"ejs": "~1.0.0",
"jquery": "~2.1.0",
"multer": "~0.1.7",
"busboy": "~0.2.9",
"connect-busboy":"~0.0.2",
"fs-extra":"~0.16.3"
},
"devDependencies": {
"grunt-concurrent": "~1.0.0",
"grunt-contrib-csslint": "^0.3.1",
"grunt-contrib-cssmin": "~0.10.0",
"grunt-contrib-jshint": "~0.10.0",
"grunt-contrib-uglify": "~0.6.0",
"grunt-contrib-watch": "~0.6.1",
"grunt-env": "~0.4.1",
"grunt-karma": "~0.9.0",
"grunt-mocha-test": "~0.12.1",
"grunt-ng-annotate": "~0.4.0",
"grunt-node-inspector": "~0.1.3",
"grunt-nodemon": "~0.3.0",
"karma": "~0.12.0",
"karma-chrome-launcher": "~0.1.2",
"karma-coverage": "~0.2.0",
"karma-firefox-launcher": "~0.1.3",
"karma-jasmine": "~0.2.1",
"karma-phantomjs-launcher": "~0.1.2",
"karma-requirejs": "^0.2.2",
"load-grunt-tasks": "~1.0.0",
"requirejs": "^2.1.15",
"should": "~4.1.0",
"supertest": "~0.14.0"
}
}
And I get the error in the jenkins console log:
+ npm install
npm WARN package.json mean#0.0.1 No repository field.
> mean#0.0.1 postinstall /var/lib/jenkins/jobs/Paygevity/workspace
> bower install --config.interactive=false
sh: 1: bower: not found
npm ERR! Linux 3.13.0-43-generic
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install"
npm ERR! node v0.12.0
npm ERR! npm v2.5.1
npm ERR! code ELIFECYCLE
npm ERR! mean#0.0.1 postinstall: `bower install --config.interactive=false`
npm ERR! Exit status 127
npm ERR!
npm ERR! Failed at the mean#0.0.1 postinstall script 'bower install --config.interactive=false'.
npm ERR! This is most likely a problem with the mean package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! bower install --config.interactive=false
npm ERR! You can get their info via:
npm ERR! npm owner ls mean
npm ERR! There is likely additional logging output above.

Resources