无法在 Angular 9 项目中使用外部 CSS 样式表答案

【问题标题】：Unable to use external css stylesheet in angular 9 project无法在 Angular 9 项目中使用外部 CSS 样式表
【发布时间】：2020-06-04 16:23:20
【问题描述】：

我是 Angular 的新手，正在尝试用 W3 CSS 实现一些东西。我试图将此 CSS 添加到我的项目中。以下是我遵循的步骤

在我的项目目录中运行 npm install --save w3-css
在 angular.json 中添加了node_modules/w3-css/w3.css

"styles": [
          "src/styles.css",
          "node_modules/w3-css/w3.css"
        ],

之后我尝试将 css 类添加到我的组件 html 文件中

<div class="w3-container w3-border w3-large">
    <div class="w3-left-align"><p>Left aligned text.</p></div>
    <div class="w3-right-align"><p>Right aligned text.</p></div>
</div>

但我没有看到任何添加的类。

注意：node_modules 文件夹和 angular json 在同一目录下。

【问题讨论】：

显示你是如何在angular.json中添加css的
@David 更新了问题
"./node_modules/w3-css/w3.css" 试试这个

标签： css angular w3-css

【解决方案1】：

在 style.css 文件中导入您的 css。

@import "../node_modules/w3-css/w3.css";

【讨论】：

嘿，这行得通，但这不会在部署过程中造成任何问题吗？
您能告诉我，即使我们将它添加到 angular.json 的样式数组中，它还是无法正常工作的原因是什么？
不，它不会导致任何部署问题。可能是您没有在 angular.json 文件的正确位置导入 css 文件。