web-dev-qa-db-fra.com

Angular Aucune fabrique de modules disponible pour le type de dépendance: ContextElementDependency

Fonctionnement ng build sur mon projet Angular 4 donne cette erreur:

     14% building modules 40/46 modules 6 active ...es\@angular\http\@angular\http.es5.js
An error occured during the build:
Error: No module factory available for dependency type: ContextElementDependency
    at Compilation.addModuleDependencies (D:\dev\workspace\rep\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:213:21)
    at Compilation.processModuleDependencies (D:\dev\workspace\rep\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:202:8)
    at _this.buildModule.err (D:\dev\workspace\rep\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:350:14)
    at building.forEach.cb (D:\dev\workspace\rep\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:147:27)
    at Array.forEach (native)
    at callback

J'ai lu beaucoup de questions/réponses sur github et stackoverflow sur cette question, mais aucun d'eux ne m'a aidé.

Comme les réponses le suggéraient, j'ai supprimé Webpack, mais cela n'a pas aidé. Node_modules supprimé, Webpack supprimé de package.json, exécuter npm install, n'a toujours pas aidé. Cache nettoyé de npm, Webpack supprimé de package.json, exécuter npm install, toujours pas de résultat. Et beaucoup d'autres suggestions similaires n'ont pas aidé.

Quand je supprime webpack de package.json et exécute npm install je reçois ce qui suit:

 Cannot find module 'webpack/lib/node/NodeTemplatePlugin' Error: Cannot
 find module 'webpack/lib/node/NodeTemplatePlugin'
     at Function.Module._resolveFilename (module.js:469:15)
     at Function.Module._load (module.js:417:25)
     at Module.require (module.js:497:17)
     at require (internal/module.js:20:19)
     at Object.<anonymous> (D:\dev\workspace\rep\node_modules\html-webpack-plugin\lib\compiler.js:11:26)
     at Module._compile (module.js:570:32)
     at Object.Module._extensions..js (module.js:579:10)
     at Module.load (module.js:487:32)
     at tryModuleLoad (module.js:446:12)
     at Function.Module._load (module.js:438:3)
     at Module.require (module.js:497:17)
     at require (internal/module.js:20:19)
     at Object.<anonymous> (D:\dev\workspace\rep\node_modules\html-webpack-plugin\index.js:7:21)
     at Module._compile (module.js:570:32)
     at Object.Module._extensions..js (module.js:579:10)
     at Module.load (module.js:487:32)

Lorsque vous retournez webpack dans package.json, exécutez npm install puis exécutez npm list webpack _ j’obtiens le résultat suivant:

+-- @angular/[email protected]
| `-- [email protected]
`-- [email protected]

Voici package.json du projet:

{
  "name": "somename",
  "version": "1.0.0",
  "description": "",
  "author": "",
  "url": "",
  "copyright": "somec",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "^4.4.5",
    "@angular/compiler": "^4.4.5",
    "@angular/core": "^4.4.5",
    "@angular/forms": "^4.4.5",
    "@angular/http": "^4.4.5",
    "@angular/platform-browser": "^4.4.5",
    "@angular/platform-browser-dynamic": "^4.4.5",
    "@angular/router": "^4.4.5",
    "@angular/upgrade": "^4.4.5",
    "Amazon-cognito-identity-js": "^1.21.0",
    "chart.js": "2.7.0",
    "core-js": "2.5.1",
    "font-awesome": "^4.7.0",
    "jquery": "^3.2.1",
    "moment": "2.18.1",
    "ng2-charts": "1.6.0",
    "ngx-bootstrap": "1.9.3",
    "raw-loader": "^0.5.1",
    "rxjs": "5.4.3",
    "simple-line-icons": "^2.4.1",
    "ts-helpers": "1.1.2",
    "zone.js": "0.8.17"
  },
  "devDependencies": {
    "@angular/cli": "^1.4.7",
    "@angular/compiler-cli": "^4.4.5",
    "@types/jasmine": "2.6.0",
    "@types/jquery": "^3.2.13",
    "@types/node": "8.0.28",
    "codelyzer": "3.2.0",
    "jasmine-core": "2.8.0",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "1.7.1",
    "karma-chrome-launcher": "2.2.0",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "1.3.0",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "0.2.2",
    "node-sass": "^4.5.3",
    "postcss-loader": "^2.0.6",
    "protractor": "5.1.2",
    "sass-loader": "^6.0.6",
    "ts-node": "3.3.0",
    "tslint": "5.7.0",
    "TypeScript": "2.5.2",
    "webpack": "^3.6.0"
  },
  "engines": {
    "node": ">= 6.9.0",
    "npm": ">= 3.0.0"
  }
}

Quand je clone ce repo sur une autre machine, lancez npm install puis ng build _ ça va, ça va, mais sur le mien, cela donne cette erreur. J'ai essayé de supprimer complètement le dépôt de ma machine, de cloner à partir de rien et de lancer npm install et ng build, toujours la même erreur.

Quelqu'un peut-il s'il vous plaît dire quelle peut être la raison de ce comportement et comment y remédier?

angularwebpackangular-cli
35
komron

Mesures que j'ai prises pour résoudre ce problème au cas où quelqu'un le rencontrerait:

  1. Package.json: Supprimer le Webpack de DevDependencies
  2. rm -R node_modules _ (supprime le dossier node_modules)
  3. npm i -g webpack
  4. npm i -g webpack-dev-server
  5. retirer package-lock.json _ (si c'est là)
  6. npm i
  7. npm start

Je ne comprends toujours pas complètement les raisons pour lesquelles cela s'est produit.

69
komron

Faites npm ls webpack

Si vous voyez deux versions de webpack (sous @ angular/cli et les nœuds_modules racines), c’est le problème qui se pose alors. Supprimer/Renommer le pack Web sous @angular/cli Et dans le dossier .bin De @angular/cli.

Problème résolu pour moi

13
phacic