"No module factory available for dependency type: ContextElementDependency" after migrating an universal project to Angular 7 #13298

templth · 2018-12-25T18:15:35Z

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

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

Command (mark with an `x`)

- [ ] new
- [ ] build
- [x] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

Angular CLI: 7.1.4
Node: 9.4.0
OS: linux x64
Angular: 7.1.4
... animations, cli, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.11.4
@angular-devkit/build-angular     0.11.4
@angular-devkit/build-optimizer   0.11.4
@angular-devkit/build-webpack     0.11.4
@angular-devkit/core              7.1.4
@angular-devkit/schematics        7.1.4
@angular/cdk                      6.4.7
@angular/flex-layout              7.0.0-beta.22
@ngtools/webpack                  7.1.4
@schematics/angular               7.1.4
@schematics/update                0.11.4
rxjs                              6.3.3
typescript                        3.1.6
webpack                           4.20.2

Repro steps

With this package.json I execute the ng serve command:

{
  "name": "myapp",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^7.1.4",
    "@angular/cdk": "^6.4.7",
    "@angular/common": "^7.1.4",
    "@angular/compiler": "^7.1.4",
    "@angular/core": "^7.1.4",
    "@angular/flex-layout": "^7.0.0-beta.19",
    "@angular/forms": "^7.1.4",
    "@angular/http": "^7.1.4",
    "@angular/platform-browser": "^7.1.4",
    "@angular/platform-browser-dynamic": "^7.1.4",
    "@angular/platform-server": "^7.1.4",
    "@angular/router": "^7.1.4",
    "@ngrx/effects": "^7.0.0",
    "@ngrx/entity": "^7.0.0",
    "@ngrx/store": "^7.0.0",
    "@ngrx/store-devtools": "^7.0.0",
    "@nguniversal/common": "^7.0.2",
    "@nguniversal/express-engine": "^7.0.2",
    "@nguniversal/module-map-ngfactory-loader": "^7.0.2",
    "compression": "^1.7.3",
    "core-js": "^2.5.4",
    "domino": "^2.1.0",
    "negotiator": "^0.6.1",
    "ngrx-store-freeze": "^0.2.4",
    "rxjs": "~6.3.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.11.0",
    "@angular/cli": "~7.1.4",
    "@angular/compiler-cli": "^7.1.4",
    "@angular/language-service": "^7.1.4",
    "@ngrx/schematics": "^6.1.0",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.3.0",
    "express": "^4.16.3",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "ngx-i18nsupport": "^0.17.1",
    "protractor": "~5.4.0",
    "ts-loader": "^5.3.2",
    "ts-node": "^7.0.1",
    "tslint": "~5.11.0",
    "typescript": "~3.1.6",
    "webpack": "4.20.2",
    "webpack-bundle-analyzer": "2.9.2",
    "webpack-cli": "3.1.1"
  }
}

The log given by the failure

The error I have:

ng serve
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
 13% building modules 31/31 modules 0 active✖ ｢wdm｣: Error: No module factory available for dependency type: ContextElementDependency
    at addDependency (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:671:12)
    at iterationOfArrayCallback (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:186:3)
    at addDependenciesBlock (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:689:5)
    at iterationOfArrayCallback (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:186:3)
    at addDependenciesBlock (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:692:5)
    at Compilation.processModuleDependencies (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:700:4)
    at afterBuild (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:832:15)
    at buildModule.err (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:876:11)
    at callback (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:613:5)
    at module.build.error (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:653:12)
    at resolveDependencies (/home/templth/myapp/node_modules/webpack/lib/ContextModule.js:282:4)
    at ContextModule.result.resolveDependencies (/home/templth/myapp/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:503:25)
    at ContextModule.build (/home/templth/myapp/node_modules/webpack/lib/ContextModule.js:203:8)
    at Compilation.buildModule (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:618:10)
    at factory.create (/home/templth/myapp/node_modules/webpack/lib/Compilation.js:859:14)
    at hooks.afterResolve.callAsync (/home/templth/myapp/node_modules/webpack/lib/ContextModuleFactory.js:163:16)
/home/templth/myapp/node_modules/neo-async/async.js:14
    throw new Error('Callback was already called.');
    ^

Error: Callback was already called.
    at throwError (/home/templth/myapp/node_modules/neo-async/async.js:14:11)
    at /home/templth/myapp/node_modules/neo-async/async.js:2813:7
    at process._tickCallback (internal/process/next_tick.js:150:11)

Desired functionality

Mention any other details that might be useful

The text was updated successfully, but these errors were encountered:

alan-agius4 · 2018-12-25T18:38:08Z

The issue here is that you might have multiple version of webpack installed. You should remove webpack from your package.json. As webpack is already a transitive dependency of @angular-devkit/build-angular and having multiple webpack versions might cause issues as the one mentioned above.

See #6417 (comment)

Closing as this seems to be caused by trying to install a different version of webpack than the one that @angular-devkit/build-angular depends on and is a duplicate of #6417.

You can check if you have multiple versions of webpack by doing npm ls webpack.

edwinquaihoi · 2019-01-05T08:01:51Z

I had this issue when upgrading from NG5 to NG7. What worked for me was to uninstall webpack (npm uninstall --save-dev webpack) and then run a "npm install --save-dev @angular-devkit/build-angular@latest". Doing this installs webpack as transitive dependency and ensures you only have one installed locally. I also upgraded to the latest Node version (10).

JackConnor · 2019-02-22T19:12:42Z

edwinquaihoi that worked for me thanks.

gokhanmerden · 2019-02-24T01:01:58Z

@edwinquaihoi thanks

gnganapath · 2019-03-04T12:05:39Z

webpack is included in angular devDepencies . Just remove it will work. Because, we already have @angular-devkit/build-angular. it's duplicate make conflict

dreadnautxbuddha · 2019-03-06T08:33:46Z

Thanks, @edwinquaihoi . This worked with Node v8.15.0

luchocab · 2019-04-09T18:37:04Z

@edwinquaihoi Thanks!! worked for me!

gaikwadvaibhav · 2019-05-09T05:22:23Z

@edwinquaihoi Thanks.

- npm uninstall --save-dev webpack

- npm install --save-dev @angular-devkit/build-angular@latest

Work for me!

ngnam · 2019-06-04T07:26:04Z

Thanks

dfa1234 · 2019-06-04T19:17:24Z

then run a "npm install --save-dev @angular-devkit/build-angular@latest".

Ok this one is correct, just not as for today.
Angular 8 is out this week, I'm on 7 currently, and I just found a question on SO answered 10 hours ago ( ...! ) saying you need to do

npm install --save-dev @angular-devkit/[email protected]

This version worked for me.

zhongyong · 2019-06-10T01:44:10Z

npm install --save-dev @angular-devkit/[email protected]
ok 3q delete "webpack": "^4.32.2",

Hansel03 · 2019-06-11T14:47:46Z

@edwinquaihoi Thanks.

npm uninstall --save-dev webpack
npm install --save-dev @angular-devkit/build-angular@latest

Work for me!

liuganchen · 2019-06-28T09:37:11Z

npm uninstall --save-dev webpack

npm install --save-dev @angular-devkit/build-angular@latest

good !!!!

Aviw13 · 2019-08-07T14:20:19Z

For Angular@8 I had to remove webpack-stream package as it uses another version of webpack than @angular-devkit/build-angular.

angular-automatic-lock-bot · 2019-09-09T19:42:26Z

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.}

alan-agius4 closed this as completed Dec 25, 2018

angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

"No module factory available for dependency type: ContextElementDependency" after migrating an universal project to Angular 7 #13298

"No module factory available for dependency type: ContextElementDependency" after migrating an universal project to Angular 7 #13298

templth commented Dec 25, 2018 •

edited

Loading

alan-agius4 commented Dec 25, 2018 •

edited

Loading

edwinquaihoi commented Jan 5, 2019

JackConnor commented Feb 22, 2019

gokhanmerden commented Feb 24, 2019

gnganapath commented Mar 4, 2019 •

edited

Loading

dreadnautxbuddha commented Mar 6, 2019

luchocab commented Apr 9, 2019

gaikwadvaibhav commented May 9, 2019

ngnam commented Jun 4, 2019

dfa1234 commented Jun 4, 2019 •

edited

Loading

zhongyong commented Jun 10, 2019

Hansel03 commented Jun 11, 2019

liuganchen commented Jun 28, 2019

Aviw13 commented Aug 7, 2019

angular-automatic-lock-bot bot commented Sep 9, 2019

"No module factory available for dependency type: ContextElementDependency" after migrating an universal project to Angular 7 #13298

"No module factory available for dependency type: ContextElementDependency" after migrating an universal project to Angular 7 #13298

Comments

templth commented Dec 25, 2018 • edited Loading

Bug Report or Feature Request (mark with an x)

Command (mark with an x)

Versions

Repro steps

The log given by the failure

Desired functionality

Mention any other details that might be useful

alan-agius4 commented Dec 25, 2018 • edited Loading

edwinquaihoi commented Jan 5, 2019

JackConnor commented Feb 22, 2019

gokhanmerden commented Feb 24, 2019

gnganapath commented Mar 4, 2019 • edited Loading

dreadnautxbuddha commented Mar 6, 2019

luchocab commented Apr 9, 2019

gaikwadvaibhav commented May 9, 2019

ngnam commented Jun 4, 2019

dfa1234 commented Jun 4, 2019 • edited Loading

zhongyong commented Jun 10, 2019

Hansel03 commented Jun 11, 2019

liuganchen commented Jun 28, 2019

Aviw13 commented Aug 7, 2019

angular-automatic-lock-bot bot commented Sep 9, 2019

templth commented Dec 25, 2018 •

edited

Loading

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

Command (mark with an `x`)

alan-agius4 commented Dec 25, 2018 •

edited

Loading

gnganapath commented Mar 4, 2019 •

edited

Loading

dfa1234 commented Jun 4, 2019 •

edited

Loading