Webpack Angular 4开始的问题
我在我的Angular 4项目中遇到依赖问题。 这是package.json文件：
{ "name": "angular-webpack-starter", "version": "1.0.0", "description": "A webpack starter for Angular", "scripts": { "start": "webpack-dev-server --hot --inline --progress --port 8080 --open", "test": "karma start", "build": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail" }, "dependencies": { "@angular/animations": "^4.2.5", "@angular/common": "^4.2.5", "@angular/compiler": "^4.2.5", "@angular/compiler-cli": "^4.2.5", "@angular/core": "^4.2.5", "@angular/forms": "^4.2.5", "@angular/http": "^4.2.5", "@angular/platform-browser": "^4.2.5", "@angular/platform-browser-dynamic": "^4.2.5", "@angular/platform-server": "^4.2.5", "@angular/router": "^4.2.5", "core-js": "^2.4.1", "ngx-infinite-scroll": "^0.5.1", "rxjs": "5.4.1", "zone.js": "^0.8.12", "typescript": "^2.4.1" }, "devDependencies": { "@angular/cli": "^1.2.0", "@angular/compiler-cli": "4.2.5", "@types/core-js": "^0.9.42", "@types/jasmine": "^2.5.53", "@types/node": "^8.0.6", "angular2-template-loader": "^0.6.2", "awesome-typescript-loader": "^3.2.1", "css-loader": "^0.28.4", "file-loader": "^0.11.2", "html-loader": "^0.4.5", "html-webpack-plugin": "^2.29.0", "jasmine": "^2.6.0", "jasmine-core": "^2.6.4", "karma": "^1.7.0", "karma-chrome-launcher": "^2.2.0", "karma-jasmine": "^1.1.0", "karma-sourcemap-loader": "^0.3.7", "karma-typescript": "^3.0.4", "karma-webpack": "^2.0.3", "node-sass": "^4.5.3", "null-loader": "^0.1.1", "raw-loader": "^0.5.1", "rimraf": "^2.6.1", "sass-loader": "^6.0.6", "script-loader": "^0.7.0", "style-loader": "^0.18.2", "to-string-loader": "^1.1.5", "typescript": "^2.4.1", "typings": "^2.1.1", "url-loader": "^0.5.9", "webpack": "^3.0.0", "webpack-dev-server": "^2.2.0", "webpack-merge": "^4.1.0" } }
并运行npm start我得到以下错误：
> webpack-dev-server --hot --inline --progress --port 8080 --open C:\...project_folder...\node_modules\extract-text-webpack-plugin\index.js:187 throw new Error("Breaking change: extract now only takes a single argument. Either an options " + ^ Error: Breaking change: extract now only takes a single argument. Either an options object *or* the loader(s). Example: if your old code looked like this: ExtractTextPlugin.extract('style-loader', 'css-loader') You would change it to: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) The available options are: use: string | object | loader[] fallback: string | object | loader[] publicPath: string at Function.ExtractTextPlugin.extract (C:\...project_folder...\node_modules\extract-text-webpack-plugin\index.js:187:9) at Object.<anonymous> (C:\...project_folder...\config\webpack.common.js:35:30) 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> (C:\...project_folder...\config\webpack.dev.js:3:20) 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) npm ERR! Windows_NT 10.0.15063 npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "start" npm ERR! node v6.11.0 npm ERR! npm v3.10.10 npm ERR! code ELIFECYCLE npm ERR! angular-webpack-starter@1.0.0 start: `webpack-dev-server --hot --inline --progress --port 8080 --open` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the angular-webpack-starter@1.0.0 start script 'webpack-dev-server --hot --inline --progress --port 8080 --open'. npm ERR! Make sure you have the latest version of node.js and npm installed. npm ERR! If you do, this is most likely a problem with the angular-webpack-starter package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! webpack-dev-server --hot --inline --progress --port 8080 --open npm ERR! You can get information on how to open an issue for this project with: npm ERR! npm bugs angular-webpack-starter npm ERR! Or if that isn't available, you can get their info via: npm ERR! npm owner ls angular-webpack-starter npm ERR! There is likely additional logging output above. npm ERR! Please include the following file with any support request: npm ERR! C:\...project_folder...\npm-debug.log
有谁知道什么似乎是问题？ 我试过更改版本并删除node_modules文件夹并运行npm install ，但是每次都发生同样的事情。
在你的webpack.config.js文件中
更改
ExtractTextPlugin.extract('style-loader', 'css-loader')
至
ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' })
因为，语法在最新版本中被改变。
希望，这将有所帮助！