Question

我正在尝试使用webpack在我的Angular（4）应用程序中设置角度材质，我在文档中看到我需要包含一个默认主题才能使用它。建议的方法之一是使用

@import '~@angular/material/prebuilt-themes/indigo-pink.css';

如果使用angular-cli，请在styles.scss中

。

现在，我没有使用angular-cli，但我有一个主要的styles.scss，所以我包含了这个，我的应用程序构建正常，但是当我加载它时出现错误

GET http://localhost:8080/@angular/material/prebuilt-themes/indigo-pink.css 404 (Not Found)

那么，为什么现在要查找此文件？在捆绑时间内，webpack不应该寻找吗？而且，在@import？

之后，这意味着什么呢？

谢谢

Answer 1

我跟随Angular guide for Webpack setup或多或少，所以我将所有供应商库都包含在名为vendor的块中，基于./src/vendor.ts。我刚插入

import "@angular/material";
import "@angular/material/prebuilt-themes/indigo-pink.css";

在那里，Webpack在主题CSS中滚动。

Answer 2

我尝试了各种方法将材料主题包含在我使用“npm run build:client-reports:externals”创建的 element.js（作为单个文件）中，但没有成功。

只有在我尝试使用我的 element.js 的项目中也引用了 main.js 时，它才有效

我们如何在导出的 element.js 中将材料主题包含在单个文件中，而不需要像 main.js 这样的任何其他引用

如果需要，很乐意提供更多详细信息。