使用 Aurelia CLI 在 `au new` 之后混淆 webpack 规则答案

【问题标题】：Confusing webpack rule after `au new` using Aurelia CLI使用 Aurelia CLI 在 `au new` 之后混淆 webpack 规则
【发布时间】：2019-07-08 23:45:05
【问题描述】：

我试图了解发生了什么违反我对 webpack 理解的魔法。

重现：

`au new -u -s http2,dotnet-core,typescript,htmlmin-min,vscode,scaffold-navigation。
打开webpack.config.js
查看模块规则：

注意这条规则：

{
    test: /\.css$/i,
    issuer: [{ test: /\.html$/i }],
    // CSS required in templates cannot be extracted safely
    // because Aurelia would try to require it again in runtime
    use: cssRules
}

cssRules 定义为：

const cssRules = [
  { loader: 'css-loader' },
];

所有这一切似乎意味着<require> 一个css 文件的html 文件将只使用css-loader。根据我的理解，css-loader 根本不会将 CSS 注入页面。至少，style-loader 需要将 CSS 注入 html 文件。

然而，当我 <require> 一个 CSS 文件时，它的工作方式完全符合预期。

有人可以解释为什么会这样吗？

【问题讨论】：

标签： webpack webpack-4 aurelia

【解决方案1】：

当然，我只是偶然发现了自己问题的答案。也许这会帮助别人......

来自https://github.com/jods4/aurelia-webpack-build/wiki/CSS-doesn't-load：

视野中有一个 Aurelia。在这种情况下，Aurelia 已经提供了在 DOM 中插入 CSS 的功能，并且只需要 CSS 代码。你只需要 css-loader。

【讨论】：