--mode development Error: NormalModuleFactory.beforeResolve is no longer a waterfall hook
Asked Answered
S

0

9

I use webpack 5 and @ngtools/webpack together to build angular application. when i run webpack --mode development following errors appear:

Error: NormalModuleFactory.beforeResolve is no longer a waterfall hook, but a bailing hook instead. Do not return the passed object, but modify it instead. Returning false will ignore the request and results in no module created.
    at /home/alecoder/Projects/JS/ap/node_modules/webpack/lib/NormalModuleFactory.js:543:11
    at eval (eval at create (/home/alecoder/Projects/JS/ap/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:12:1)
(node:17432) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:17432) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:17432) UnhandledPromiseRejectionWarning: Error: NormalModuleFactory.beforeResolve is no longer a waterfall hook, but a bailing hook instead. Do not return the passed object, but modify it instead. Returning false will ignore the request and results in no module created.
    at /home/alecoder/Projects/JS/ap/node_modules/webpack/lib/NormalModuleFactory.js:543:11
    at eval (eval at create (/home/alecoder/Projects/JS/ap/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:12:1)
(node:17432) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 2)

Please note that before i was using @ngtools/webpack 9.0.0 and at this time i was getting another errors.

not the version is 9.1.4 and getting that errors.

Here are whole dependencies:

"dependencies": {
    "@angular/animations": "~9.1.0",
    "@angular/common": "~9.1.0",
    "@angular/compiler": "~9.1.0",
    "@angular/core": "~9.1.0",
    "@angular/forms": "~9.1.0",
    "@angular/platform-browser": "~9.1.0",
    "@angular/platform-browser-dynamic": "~9.1.0",
    "@angular/router": "7.2.15",
    "@fortawesome/angular-fontawesome": "^0.4.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.28",
    "@fortawesome/free-solid-svg-icons": "^5.13.0",
    "@ngrx/effects": "^7.4.0",
    "@ngrx/entity": "^7.4.0",
    "@ngrx/router-store": "^7.4.0",
    "@ngrx/store": "^7.4.0",
    "concurrently": "^5.1.0",
    "core-js": "^2.6.11",
    "google-maps": "^3.3.0",
    "http-server": "^0.12.3",
    "json-stringify": "^1.0.0",
    "lite-server": "^2.5.4",
    "mini-css-extract-plugin": "^0.9.0",
    "ng-un-slider": "1.1.67-alpha-27",
    "ng2-nouislider": "1.7.13",
    "ngrx-store-localstorage": "^7.0.1",
    "ngx-build-plus": "^9.0.4",
    "nouislider": "^12.1.0",
    "precss": "^4.0.0",
    "rxjs": "^6.5.3",
    "rxjs-compat": "6.5.3",
    "tslib": "^1.11.1",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/architect": "file:libs/_angular-devkit_architect.tgz",
    "@angular-devkit/architect-cli": "file:libs/_angular-devkit_architect-cli.tgz",
    "@angular-devkit/build-angular": "file:libs/_angular-devkit_build-angular.tgz",
    "@angular-devkit/build-ng-packagr": "file:libs/_angular-devkit_build-ng-packagr.tgz",
    "@angular-devkit/build-optimizer": "file:libs/_angular-devkit_build-optimizer.tgz",
    "@angular-devkit/build-webpack": "file:libs/_angular-devkit_build-webpack.tgz",
    "@angular-devkit/core": "file:libs/_angular-devkit_core.tgz",
    "@angular-devkit/schematics": "file:libs/_angular-devkit_schematics.tgz",
    "@angular-devkit/schematics-cli": "file:libs/_angular-devkit_schematics-cli.tgz",
    "@angular/cli": "file:libs/_angular_cli.tgz",
    "@angular/compiler-cli": "~9.1.0",
    "@angular/language-service": "~9.1.0",
    "@angular/pwa": "file:libs/_angular_pwa.tgz",
    "@ngrx/store-devtools": "^7.4.0",
    "@ngtools/webpack": "^9.1.4",
    "@schematics/angular": "file:libs/_schematics_angular.tgz",
    "@schematics/schematics": "file:libs/_schematics_schematics.tgz",
    "@schematics/update": "file:libs/_schematics_update.tgz",
    "@types/google-maps": "^3.2.2",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "circular-dependency-plugin": "^5.2.0",
    "clean-webpack-plugin": "^3.0.0",
    "codelyzer": "^5.1.2",
    "copy-webpack-plugin": "^5.1.1",
    "cross-env": "^7.0.2",
    "css-loader": "^3.5.3",
    "css-to-string-loader": "^0.1.3",
    "extract-text-webpack-plugin": "^3.0.2",
    "file-loader": "^6.0.0",
    "html-loader": "^1.1.0",
    "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin.git#master",
    "indexhtml-webpack-plugin": "^0.1.9",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~2.1.0",
    "karma-jasmine": "~3.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "midas": "^2.0.3",
    "ngrx-store-freeze": "^0.2.4",
    "node-sass": "^4.13.1",
    "npm-force-resolutions": "0.0.3",
    "postcss-loader": "^3.0.0",
    "postcss-nested": "^4.2.1",
    "protractor": "~5.4.3",
    "raw-loader": "^4.0.1",
    "resolve": "^1.17.0",
    "sass": "^1.26.5",
    "sass-loader": "^8.0.2",
    "serve": "^11.3.0",
    "source-map-loader": "^0.2.4",
    "style-loader": "^1.2.1",
    "suppress-chunks-webpack-plugin": "^1.0.6",
    "to-string-loader": "^1.1.6",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "^3.8.3",
    "url-loader": "^4.1.0",
    "webpack": "git://github.com/webpack/webpack.git#dev-1",
    "webpack-bundle-analyzer": "^3.7.0",
    "webpack-cli": "^3.3.11",
    "webpack-dev-server": "^3.10.3",
    "webpack-virtual-modules": "^0.2.1"
  }

if i update webpack version to 4.43.0 everything works fine. It seems webpack and @ngtools/webpack can't work together.

Is here any additional information i missed which might be useful to set-up this project with webpack 5 ?

Sibylle answered 5/5, 2020 at 11:59 Comment(3)
Did you figure this out?Bushido
It was about the versioning issue between beta Webpack 5 and Angular. Now you can easily integrate Webpack 5 into Angular without any similar issue.Sibylle
@AlexanderGharibashvili Can you show your webpack.config.js script? I'm not finding it easy at all to get Angular / Nativescript working with Webpack 5 (I get the same error that you did above), however maybe it's because I'm using a code sharing (ng-schematics) project.Hessenassau

© 2022 - 2024 — McMap. All rights reserved.