Angular 错误没有可用于依赖类型 : ContextElementDependency 的模块工厂

Question

我正在尝试运行 Angular 5 应用程序并执行后

npm install

和

npm start

我收到此错误:

ng serve

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
 20% building modules 88/102 modules 14 active ..._modules\@angular\forms\esm5\forms.jsError: No module factory available for dependency type: ContextElementDependency
    at Compilation.addModuleDependencies (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:215:21)
    at Compilation.processModuleDependencies (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:204:8)
    at _this.buildModule.err (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:359:14)
    at building.forEach.cb (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:149:27)
    at Array.forEach (<anonymous>)
    at callback (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:149:13)
    at module.build (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:176:11)
    at resolveDependencies (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\ContextModule.js:165:4)
    at ContextModule.result.resolveDependencies (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:440:25)
    at ContextModule.build (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\ContextModule.js:105:8)
    at Compilation.buildModule (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:151:10)
    at factoryCallback (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\Compilation.js:344:12)
    at C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@angular\cli\node_modules\webpack\lib\ContextModuleFactory.js:95:13
    at C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\tapable\lib\Tapable.js:268:11
    at done.then (C:\dev\ssmith\github.com\ebs2\src\FrontEndSrc\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:442:28)
    at <anonymous>                                                                                                                               70% building modules 1717/1717 modules 0 active

我已多次尝试删除并重新安装node_modules。我有一个队友使用相同的代码没有遇到这个问题。但是，从源克隆到我的计算机上的单独文件夹会导致相同的行为。

> npm --version

5.6.0

和

> ng --version

Angular: 5.0.5
... animations, common, compiler, compiler-cli, core, forms
... http, platform-browser, platform-browser-dynamic, router

@angular/cli: 1.6.8
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.23
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.8
@schematics/angular: 0.1.17
@schematics/schematics: 0.0.11
typescript: 2.4.2
webpack: 3.11.0

package.json

{
  "name": "smartadmin",
  "version": "0.6.1",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "build:dev": "./node_modules/.bin/ng build",
    "build:prod": "./node_modules/.bin/ng build --prod --aot=false",
    "build:aot": "./node_modules/.bin/ng build --prod --aot",
    "build:aot2": "node --max_old_space_size=4096 ./node_modules/.bin/ng build --prod --aot",
    "build": "npm run build:dev",
    "clean:dist": "npm run rimraf -- dist",
    "clean:install": "npm set progress=false && npm install",
    "clean:start": "npm start",
    "clean": "npm cache clean && npm run rimraf -- node_modules doc coverage dist",
    "e2e:live": "npm run e2e -- --elementExplorer",
    "e2e": "npm run protractor",
    "lint": "npm run tslint \"src/**/*.ts\"",
    "prebuild:dev": "npm run clean:dist",
    "prebuild:prod": "npm run clean:dist",
    "preclean:install": "npm run clean",
    "preclean:start": "npm run clean",
    "protractor": "protractor",
    "rimraf": "rimraf",
    "server:dev": "./node_modules/.bin/ng serve",
    "serve": "npm run server:dev",
    "start": "npm run server:dev",
    "test": "./node_modules/.bin/ng test",
    "tslint": "tslint",
    "typedoc": "typedoc",
    "ng": "ng",
    "pree2e": "webdriver-manager update --standalone false --gecko false"
  },
  "private": true,
  "dependencies": {
    "@angular-redux/store": "7.0.1",
    "@angular/animations": "5.0.5",
    "@angular/common": "5.0.5",
    "@angular/compiler": "5.0.5",
    "@angular/core": "5.0.5",
    "@angular-devkit/schematics": "0.0.42",
    "@angular-devkit/core": "0.0.23",
    "@angular/forms": "5.0.5",
    "@angular/http": "5.0.5",
    "@angular/platform-browser": "5.0.5",
    "@angular/platform-browser-dynamic": "5.0.5",
    "@angular/router": "5.0.5",
    "@swimlane/ngx-datatable": "11.1.5",
    "X-editable": "github:vitalets/x-editable",
    "bootstrap": "3.3.7",
    "bootstrap-colorpicker": "2.5.2",
    "bootstrap-duallistbox": "3.0.6",
    "bootstrap-markdown": "2.10.0",
    "bootstrap-progressbar": "0.9.0",
    "bootstrap-slider": "10.0.0",
    "bootstrap-tagsinput": "0.7.1",
    "bootstrap-timepicker": "0.5.2",
    "chart.js": "2.7.1",
    "classlist.js": "^1.1.20150312",
    "clockpicker": "0.0.7",
    "clone": "2.1.1",
    "core-js": "2.5.1",
    "debounce": "1.1.0",
    "dropzone": "5.2.0",
    "dygraphs": "2.0.0",
    "fuelux": "3.16.2",
    "he": "1.1.1",
    "highcharts": "6.0.3",
    "ion-rangeslider": "2.2.0",
    "jquery": "3.2.1",
    "jquery-color": "git+https://github.com/jquery/jquery-color.git#9e5e04c1c4ee66427fbe04cfce8155b76748ca64",
    "jquery-jcrop": "0.9.13",
    "jquery-knob": "1.2.11",
    "jquery-ui-npm": "1.12.0",
    "jquery-validation": "1.17.0",
    "jquery.maskedinput": "1.4.1",
    "markdown": "0.5.0",
    "morris.js": "0.5.0",
    "ngx-bootstrap": "^2.0.1",
    "ngx-popover": "0.0.16",
    "nouislider": "10.1.0",
    "raphael": "2.2.7",
    "redux": "3.7.2",
    "rxjs": "5.5.2",
    "scriptjs": "2.5.8",
    "select2": "4.0.6-rc.1",
    "smartadmin-plugins": "1.0.21",
    "summernote": "0.8.8",
    "to-markdown": "3.1.0",
    "ts-helpers": "1.1.2",
    "web-animations-js": "2.3.1",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@angular/cli": "^1.6.4",
    "@angular/compiler-cli": "5.0.5",
    "@types/jasmine": "2.8.2",
    "@types/jquery": "3.2.16",
    "@types/node": "8.0.54",
    "codelyzer": "4.0.1",
    "css-loader": "0.28.7",
    "exports-loader": "0.6.4",
    "expose-loader": "0.7.4",
    "file-loader": "1.1.5",
    "imports-loader": "0.7.1",
    "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.1",
    "karma-jasmine-html-reporter": "0.2.2",
    "karma-remap-istanbul": "0.6.0",
    "protractor": "5.2.0",
    "raw-loader": "0.5.1",
    "script-loader": "0.7.2",
    "style-loader": "0.19.0",
    "ts-node": "3.3.0",
    "tslint": "5.8.0",
    "typescript": "2.4.2",
    "url-loader": "0.6.2",
    "webpack": "^3.10.0"
  },
  "repository": {
    "type": "git",
    "url": "https://bitbucket.org/grigson/smartadmin-angular-2"
  },
  "bugs": {
    "url": "https://bitbucket.org/grigson/smartadmin-angular-2/issues"
  },
  "engines": {
    "node": ">= 4.2.1",
    "npm": ">= 3"
  }
}

Answer 1

这似乎已经修复了它:

1. Package.json:从 DevDependency 中删除 webpack
2. rm -R 节点模块(删除node_modules文件夹)
3. npm i -g webpack
4. npm i -gwebpack-dev-server
5. 删除 package-lock.json(如果有)
6. npm 我
7. npm 启动

同时运行 npm ls 并查看 webpack 是否列出多次。这似乎是我问题的根源。

相关答案在这里: Angular No module factory available for dependency type: ContextElementDependency