Repository navigation
Error on update to Webpack 4.0.1 #9793
Description
Versions
> ng --version
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 1.7.1
Node: 8.9.4
OS: darwin x64
Angular: 5.2.6
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker
@angular/cli: 1.7.1
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.1
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
typescript: 2.6.2
webpack: 4.0.1
Repro steps
- Update @angular/cli to 1.7.1
ng updatenpm install webpack
Observed behavior
> ng build --prod --environment=current --output-hashing=none --build-optimizer
0% compiling
An error occured during the build:
TypeError: Cannot read property 'thisCompilation' of undefined
at NodeTemplatePlugin.apply (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/webpack/lib/node/NodeTemplatePlugin.js:19:18)
at Compiler.apply (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/tapable/lib/Tapable.js:375:16)
at Object.compileTemplate (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/html-webpack-plugin/lib/compiler.js:48:17)
at Compiler.<anonymous> (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/html-webpack-plugin/index.js:47:40)
at Compiler.applyPluginsParallel (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/tapable/lib/Tapable.js:293:14)
at applyPluginsAsync.err (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/@angular/cli/node_modules/webpack/lib/Compiler.js:499:9)
at Compiler.applyPluginsAsyncSeries (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/tapable/lib/Tapable.js:195:46)
at Compiler.compile (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/@angular/cli/node_modules/webpack/lib/Compiler.js:492:8)
at readRecords.err (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/@angular/cli/node_modules/webpack/lib/Compiler.js:279:11)
at Compiler.readRecords (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/@angular/cli/node_modules/webpack/lib/Compiler.js:391:11)
at applyPluginsAsync.err (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/@angular/cli/node_modules/webpack/lib/Compiler.js:276:10)
at next (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/tapable/lib/Tapable.js:202:11)
at Compiler.compiler.plugin (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/@angular/cli/node_modules/webpack/lib/CachePlugin.js:51:59)
at Compiler.applyPluginsAsyncSeries (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/tapable/lib/Tapable.js:206:13)
at applyPluginsAsync.err (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/@angular/cli/node_modules/webpack/lib/Compiler.js:273:9)
at next (/Users/niklissad/Sites/adwise/fishad/frontend/node_modules/tapable/lib/Tapable.js:202:11)
Cannot read property 'thisCompilation' of undefined
Desired behavior
Working build
Mention any other details that might be useful (optional)
I have this problem also with
npm install @angular/cli
ng new w4
cd w4
npm install webpack
npm run build
Also on other macbook which I don't use for development with MacOS 10.13.3
Reacted by Jonathan Bass, Chris Barr, Michael Fish and Taylor LaMar
Activity
filipesilva commentedon Feb 27, 2018
To update the version of webpack, it must be updated in the Angular CLI package itself. Installing another version of webpack on the project dependencies is neither support nor will work. You would end up having multiple webpack dependencies in your project and this does not work.
We're working on an update for the next major version.
DanPride commentedon Feb 28, 2018
Same issue. I also made the mistake of updating webpack independently but no don't seem to be able to get a working build now now matter what I do. Deleted node folder/npm i with no change in result
JanTheHun commentedon Mar 1, 2018
@DanPride
I had the same issue, made the same mistake of upgrading webpack independently.
This is how I was finally able to solve the issue:
npm remove webpacknpm install webpack@3.11.0webpack's newest version (4.0.0) seems to be buggy
iSanjayAchar commentedon Mar 2, 2018
@JanTheHun
Your solution did resolve the issue for me. Thanks :)
vduzh commentedon Mar 4, 2018
I had the same problems. Update @angular/cli to 1.7.2 helped
Marciodgms commentedon Mar 8, 2018
@JanTheHun Your solution did resolve the issue for me. Thanks :)
NeyazA commentedon Mar 9, 2018
@DanPride Thanks a lot man.... your solution below worked fine for me.
npm remove webpack
npm install webpack@3.11.0
Many Thanks
anish-fullstack commentedon Mar 10, 2018
Thanks.. It worked for me too :)
martianmartian commentedon Mar 13, 2018
notice that there might be 1. global webpack 2. local webpack
two things are involved. you have to remove and re-install both to fix the issue.
fsaldivars commentedon Apr 10, 2018
Thanks @DanPride it works for me.
npm remove webpack
npm install webpack@3.11.0
HoldOffHunger commentedon May 31, 2018
@JanTheHun : Thank you!! That worked perfectly.
This was the only snag I hit when updating a 1+ year old version of ReactJS on my app. But now everything's perfectly back to normal!
katsisaac50 commentedon Jun 15, 2018
@JanTheHun : Thank you!! That worked perfectly.
douglasnaphas commentedon Sep 29, 2018
fixed the issue for me using AWS CodeBuild, Ubuntu 14.04, and Node 10.
amitesh786 commentedon Oct 26, 2018
Angular webpack issue - I have facing this error from 1 week - could anyone support me why this error comes in picture
Run
npm run webpack-dev-server --inline --progress --port 8080
Console Error
Package.json/tsconfig.json
https://v5.angular.io/guide/webpackPlease share if anyone resolve this issue awaiting...
khateeb321 commentedon Feb 5, 2019
Worked like a charm!
angular-automatic-lock-bot commentedon Sep 9, 2019
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.