我尝试运行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"
}
}
答案 0 :(得分:9)
这似乎解决了这个问题:
同时运行npm ls
并查看webpack是否多次列出。这似乎是我问题的根源。
相关答案: Angular No module factory available for dependency type: ContextElementDependency
答案 1 :(得分:0)
这似乎对我有用。 全局安装升级
本地安装升级