将CSS文件添加到数据库时出现Mime类型错误

我正在尝试使用Angular构建一个静态站点。我想要的是将一些全局css/js/image文件添加到

index.html

<link rel="stylesheet" type="text/css" href="css/layers.css">

这是我在

index.html

<link rel="stylesheet" type="text/css" href="css/layers.css">

我怎样才能解决这个问题

我的角度设置是

Angular CLI: 1.6.5
Node: 8.1.4
OS: darwin x64
Angular: 5.2.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.5
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.5
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0

---

@sameera207评论中的答案是正确的，相对路径必须有效，我也有同样的问题，评论的答案对我有效。我试图重现您的错误，我在index.html级别创建了css文件夹，添加了css文件，然后在样式数组中添加了路径

"styles": [
    "styles.css",
    "./css/my-styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "../node_modules/tether/dist/css/tether.min.css"
  ],

然后重新启动服务器，我的意思是再次执行

ng服务

，并使其工作。请确保您已经完成并重新启动了服务器，如果问题仍然存在，请告诉我，我很乐意为您提供帮助。谢谢。

解决方案1（已安装引导程序） 您需要做的只是：

1） 转到angular应用程序根目录下的.angular-cli.json

2） 修改样式数组以在styles.css之前包含引导

"styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "styles.css"
  ],

注意：引导的路径是相对于/src/index.html的，这就是为什么在节点_模块之前需要“./”

3） 退出ng serve的当前会话并重新启动它

这是一个

解决方案2（参考引导） 您只需：

1） 转到angular应用程序根目录下的styles.css

2） 在顶部添加此行：

@import url('https://unpkg.com/bootstrap@3.3.7/dist/css/bootstrap.min.css');

---

这里是

如果您已经在angularcli.json或angular.json中使用了styles.css，那么index.html中不需要它。cli将自动注入内容。因此，从index.html中删除这一行，一切都应该正常。

对于将面临同样问题的人

出现此错误消息的通常原因是，当浏览器尝试加载该资源时，服务器返回一个HTML页面。例如，如果您的路由器捕捉到未知路径并显示默认页面而没有出现

404错误。

当然这意味着该路径不会返回预期的

CSS文件/image/icon/

任何内容

假设我们有一个文件结构如下的

Angular 6

项目：

project
    |-src
      |-app
      |-assets
      |-environments 
      |----

<link rel="stylesheet" type="text/css" href: '../vendor/theme-dark.css'>

假设我们需要在src文件夹中直接放置一个

主题化

文件夹（包含css文件）

project
    |-src
      |-app
      |-assets
      |-environments
      |-vendor // Theming
         |-theme-light.css
          |theme-dark.css

如果我们尝试像这样访问该主题文件：

project
    |-src
      |-app
      |-assets
      |-environments 
      |----

<link rel="stylesheet" type="text/css" href: '../vendor/theme-dark.css'>

---

注意：确切的路径和路由器配置取决于您如何设置项目和使用Angular的库。

这是链接layers.css文件的代码

请从此行中删除

type=“text/css”

因此，代码将变为：

---

使用这条线，我希望它现在能工作。谢谢

在资产文件夹中创建新的CSS文件夹，然后将CSS文件放入CSS中，然后再次链接到新位置

Eg : -  <link rel="stylesheet" href="assets/css/materialize.min.css"> 

Eg:-

当我从终端使用

npm I-S材料图标安装材料图标时，我遇到了相同的问题

我已经按照npm软件包安装中给出的说明进行了操作，并在index.html中放置了一个链接，如
我试图通过asp.net zero使用ng serve运行angular代码，但遇到了这个问题

通常，所有角度项目都使用命令ng serve运行。但是asp.NETZero框架最初会缩小css文件，然后执行ng serve过程。这两件事集成在命令NPMSTART中。如果至少完成一次npm启动，则缩小的文件将存储在本地。。。所以下一次即使你发球，它也会起作用

所以运行
npm start
为我解决了这个问题。
有这个问题，因为我定义了相同的*.css文件，
在*.html和angular.json文件中
在angular.json中的angular上，添加配置选项

“提取CSS”：错误

像这样

"options": {
        
        "aot": true,
        "outputPath": "dist",
        "index": "src/index.html",
        "extractCss": false,
        "main": "src/main.ts",
        "polyfills": "src/polyfills.ts",
        "tsConfig": "src/tsconfig.app.json",
        "assets": [
          "src/favicon.ico",
          "src/assets"
        ],
        "styles": [
...

我的角度项目也有同样的错误。添加此
type=“text/html”
代码段后，错误消失

<link rel="stylesheet" type="text/html" href="filename.css">


您应该添加相对路径
”/css/layers.css“
mmm。。仔细检查样式的路径。。。记住angular.cli json文件从src文件夹开始..您可以通过在位置栏中键入将样式表加载到浏览器中吗？如果可以，浏览器会报告MIME类型是什么？嘿@Aravind，尝试了
/css..
，同样的问题@sameera207你能解决这个问题吗？这是唯一对我有效的答案。我仍然想知道它为什么能工作，因为它首先抱怨MIME类型是
（'text/html'）
。