我的 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! <a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="4829262f3d24293a653f2d2a38292b23653b3c293a3c2d3a087966786678" rel="noreferrer noopener nofollow">[email protected]</a> start: `webpack-dev-server --hot --inline --progress --port 8080 --open`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the <a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="31505f56445d50431c4654534150525a1c4245504345544371001f011f01" rel="noreferrer noopener nofollow">[email protected]</a> 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' })
因为，最新版本中的语法已更改。
希望，这会有所帮助!
关于node.js - Webpack Angular 4 启动问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44845928/