错误模块构建失败（来自./node_modules/@angular-devkit/build-angular/node_modules/mini-css-extract-plugin/dist/loader.js）答案

【问题标题】：ERROR in Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/mini-css-extract-plugin/dist/loader.js)错误模块构建失败（来自./node_modules/@angular-devkit/build-angular/node_modules/mini-css-extract-plugin/dist/loader.js）
【发布时间】：2020-04-16 18:23:34
【问题描述】：

当我运行ng build --prod 时出现此错误。它可以无错误地服务，但无法构建。我接力与那个绑在一起

ERROR in Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/mini-css-extract-plugin/dist/loader.js):       
TypeError: Cannot read property 'replace' of undefined
    at normalizeBackSlashDirection (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\RequestShortener.js:16:17)  
    at new RequestShortener (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\RequestShortener.js:26:15)
    at new Compiler (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\Compiler.js:195:27)
    at Compiler.createChildCompiler (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\Compiler.js:548:25)        
    at Compilation.createChildCompiler (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\Compilation.js:2100:24) 
    at Object.pitch (C:\project\tea supply chain mangement system\test2\node_modules\@angular-devkit\build-angular\node_modules\mini-css-extract-plugin\dist\loader.js:89:43)

我的依赖：

"dependencies": {
  "@agm/core": "^1.1.0",
    "@angular/animations": "8.2.14",
    "@angular/cdk": "^8.2.3",
    "@angular/common": "8.2.14",
    "@angular/compiler": "8.2.14",
    "@angular/core": "^8.2.14",
    "@angular/http": "^7.2.15",
    "@angular/material": "^8.2.3",
    "@angular/router": "8.2.14",
       ....
    "web3": "^1.2.4",
    "zone.js": "0.9.1"   
},   
   "devDependencies": {  
   "@angular-builders/custom-webpack": "^8.4.1",
    "@angular-builders/dev-server": "^7.3.1",
    "@angular-devkit/build-angular": "^0.803.21",
    "@angular-devkit/architect": "^0.803.21",
    "@angular/cli": "^8.3.21",
    "@angular/compiler-cli": "^8.2.14",
    "@angular/language-service": "8.2.14",
    .....
  }

如何解决这个错误？

【问题讨论】：

您为什么要使用 Angular CDK 的 v7 版本，它适用于使用 Angular v7 的应用程序，而不是更新到 Angular CDK 的 v8 版本？
我将它更新到 v8 但它没有帮助
您还应该更新针对 Angular 框架 v7 的其他 Angular 依赖项。
我一一更新所有依赖。但它得到同样的错误

标签： angular

【解决方案1】：

https://github.com/webpack-contrib/mini-css-extract-plugin/issues/186 的讨论包含这样一个声明，即当任何组件的 styleUrls 属性的数组值的长度大于 1 时会发生此错误。

我在一个应用程序中验证了这一点，在该应用程序中将此属性的值减小为长度为 1 的数组会使错误消失。

【讨论】：

【解决方案2】：

在我的情况下，某些 css 无法正常工作，这就是为什么会出现此错误。当我一一检查时发现它。因为这个错误隐藏了其他错误。

【讨论】：

【解决方案3】：

我有这个错误是因为我把“”是样式列表放在 angular.json 文件中的错误。我想添加 css 文件并开始输入，但我以另一种方式输入，我把这个“”留在那里。

"styles": [
  "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
  "src/styles.css",
  "node_modules/bootstrap/dist/css/bootstrap.min.css",
  "" /* <--- this line breaks everything */
],

【讨论】：