angular-cli: `ng build` fails with error `Cannot find module 'webpack/lib/node/NodeTemplatePlugin'` after updating to `v1.3.0`

Bug Report or Feature Request (mark with an `x`)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Versions.

λ ng -v
     
@angular/cli: 1.3.0
node: 8.1.2
os: win32 x64
@angular/animations: 4.3.1
@angular/common: 4.3.1
@angular/compiler: 4.3.1
@angular/core: 4.3.1
@angular/forms: 4.3.1
@angular/http: 4.3.1
@angular/platform-browser: 4.3.1
@angular/platform-browser-dynamic: 4.3.1
@angular/router: 4.3.1
@angular/cli: 1.3.0
@angular/compiler-cli: 4.3.1
@angular/language-service: 4.3.1

Repro steps.

ng build fails with error Cannot find module 'webpack/lib/node/NodeTemplatePlugin' after updating to v1.3.0.

   "devDependencies": {
-    "@angular/cli": "1.2.7",
+    "@angular/cli": "1.3.0",

The log given by the failure.

λ ng build

Cannot find module 'webpack/lib/node/NodeTemplatePlugin'
Error: Cannot find module 'webpack/lib/node/NodeTemplatePlugin'
    at Function.Module._resolveFilename (module.js:485:15)
    at Function.Module._load (module.js:437:25)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (<redacted>\node_modules\html-webpack-plugin\lib\compiler.js:11:26)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (<redacted>\node_modules\html-webpack-plugin\index.js:7:21)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)

Mention any other details that might be useful.

Might be related to #6641.

Installing webpack as a devDependency can be used as a workaround.

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 22
Comments: 20 (2 by maintainers)

Commits related to this issue

Remove package-lock so to avoid issues for developers (https://github.com/angular/angular-cli/issues/7334) — committed to almothafar/ng4-validators by almothafar 6 years ago
Remove package-lock so to avoid issues for developers (https://github.com/angular/angular-cli/issues/7334) — committed to almothafar/ng4-validators by almothafar 6 years ago

Most upvoted comments

I faced this issue many times recently and always the fix worked for me is :

rm -rf node_modules
rm package-lock.json
npm install

+124

tapas4java on Oct 19, 2017

rm -rf node_modules rm package-lock.json npm cache verify npm install

+44

Sayaren on Dec 26, 2017

@MarkTiedemann Had the same issue. Didn’t install webpack as a workaround. Fixed it by replacing my package.json dependencies with those of a new app (ng new testapp) and reinstalling npm modules. Before reinstalling remove package-lock.json and run npm cache verify. I do have to say, it would be great, if updates could be applied in a better way. (Also I noticed that there was a change in tsconfig, "lib": ["es2017", ) There should be a guide/way an existing project can update to the last version automatically/easily. One way used to be with ng init but that checked/replaced all files.

+27

nekkon on Aug 10, 2017

@filipesilva I believe it is necessary to have a way/script that will automatically update an app that was generated from a previous version of angular-cli. Something like this is possible.

nekkon on Aug 10, 2017

@valdestrijus During Angular-cli updates package.json is not the only file that could change. There are other changes that could happen in other config files also (tsconfig.json, karma.conf.js, angular-cli.json, tslint.json, protractor.conf.json, test.ts) If you don’t change those files properly then your apps could have errors/issues.

@valdestrijus Why not have an automated way that those files get updated? Why do you prefer users not updating their apps properly (by just changing the version in package.json ). This causes afterwards many unnecessary issues in this repo with complaints that things got broken. (while the problem was that they generally don’t update their app properly) This causes unnecessary waste of time for the Angular-CLI team to deal with such issues which could had been avoided in the first place.

nekkon on Aug 18, 2017

@filipesilva @hansl I do believe I can make a tool for angular-cli that will manage updates. It would detect changes between versions (apps generated with ng new) and apply them properly. (even if end-user has changed things) This would help to easily upgrade existing angular-cli projects.

Some first features of this tool:

Would take the burden off Angular-cli team whenever there is an update as everybody would easily be able to update their projects. This tool would be tested each time against various apps/scenarios/environments that everything is working properly after the update. (just changing the version number in package.json is not enough nor what ng init used to do, checking/replacing all files)
Rollback Feature: Whenever there would be an issue with an update, you would be able to revert back easily
Validation Feature: All users would have their projects updated properly (check if necessary changes have been applied). Usually there are various changes needed in config files which users do not apply cause they just change the version number.

What do you think of this? If there is something already, or you have a better way of doing it, feel free to tell me. I just made a suggestion.

nekkon on Aug 11, 2017

I just got this same problem with the latest version of angular cli today.

tommck on Mar 16, 2018