Can'；t从Angular中的assets文件夹加载CSS文件

我尝试在Angular 5项目中从资产文件夹加载CSS文件。在这个文件夹中，我有一个完整的模板，当我打开文件夹中的default index.html时，它可以正常工作

但是我想在setcard.component.html中使用它

如果我打开url localhost:4200/setcard/1，则会出现以下错误：

拒绝应用“”中的样式，因为其MIME类型（'text/html'）不是受支持的样式表MIME类型，并且启用了严格的MIME检查。 7:1拒绝应用“中的样式”http://localhost:4200/sedcard/assets/creative-agency/css/owl.carousel.css”，因为其MIME类型（“text/html”）不是受支持的样式表MIME类型，并且启用了严格的MIME检查

以下是我如何将其添加到文件src/index.html的源代码中的链接（在head中）：

hFinder

例如，当我更改sedcard/sedcard.component.html中图像的路径时，它们将被查看：

  <div class="col-md-6">
    <div id="about-slider" class="owl-carousel owl-theme">
      <img class="img-responsive" src="assets/creative-agency/img/about1.jpg" alt="">
      <img class="img-responsive" src="assets/creative-agency/img/about2.jpg" alt="">
      <img class="img-responsive" src="assets/creative-agency/img/about1.jpg" alt="">
      <img class="img-responsive" src="assets/creative-agency/img/about2.jpg" alt="">
    </div>
  </div>
  <!-- /About slider -->



唯一不同的是，图像将在src/sedcard/sedcard.component.html的资产文件夹中调用，而不是在src/index.html中调用

但我不知道我应该改变什么。谢谢您的帮助。
您需要在
资产
前面加上一个斜杠。例如

<link type="text/css" rel="stylesheet" href="/assets/creative-agency/css/magnific-popup.css" />



或



与您现在所做的不同之处在于，您总是使用
/
引用应用程序根目录；如果您没有指定，浏览器将查找与当前URL相对的资源（可能是任何资源，因为您的路由器不断更改它）
如果要准确无误，应该如下所示：

 <img class="img-responsive" src="./assets/creative-agency/img/about1.jpg" alt="">



在Angular中，底部始终是“src”文件夹。因此，无论何时尝试对某个文件进行路径设置，都有两种方法：

使用../../../folder-x/folder-y/abc.component.css手动启动
使用绝对基的文件路径查找，即src

在您的情况下，使用第二种方法更方便，因为“资产”是保存资源（css/图像/字体）文件的标准文件夹，您只需要从基本url开始

另外，“/”用于引用ES6/ECMA2015或TS（基于ES6）中的当前目录（默认情况下从Angular Project中的src文件夹开始）。最后，你的正确路径是：

“/assets/creative agency/img/about1.jpg”
您可以像这样在angular.json中使用样式数组

"styles": [
          "src/assets/creative-agency/css/owl.carousel.css",
          "src/assets/creative-agency/css/owl.theme.default.css",
          .....
        ]

首先，必须从src/index.html文件中删除这一行

 <link type="text/css" rel="stylesheet" href="./assets/creative-agency/css/owl.carousel.css" />

我希望它对您有用。
检查这里，我在尝试从资产文件夹中包含css文件时遇到了相同的问题。浏览器开发工具中的“网络”选项卡提供有关某个路径是否已解析的信息。如果路径错误，您可以看到与预期工作路径不匹配的地方并进行修复。此答案已经给出。您可以通过编辑来改进给定的答案。
"styles": [
          "src/assets/creative-agency/css/owl.carousel.css",
          "src/assets/creative-agency/css/owl.theme.default.css",
          .....
        ]

 <link type="text/css" rel="stylesheet" href="./assets/creative-agency/css/owl.carousel.css" />

"styles": [
          "src/assets/creative-agency/css/owl.carousel.css",
          "src/assets/creative-agency/css/owl.theme.default.css",
          
        ]