由于 MIME 类型为 text/html，样式表未加载

在 Firefox 上运行 MERN 应用程序时，在浏览器控制台中出现此错误，并且未加载 css：The stylesheet http://localhost:3000/src/css/component.css was not loaded because its MIME type, “text/html”, is not “text/css”

我正在添加CSSindex.html像这样 ：

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

我哪里出错了？

除了 React 组件之外，还有哪些其他方法可以为部分添加外部 css？

代码是Here https://gitlab.com/menkudle/MERN-CommentBox

样式表http://localhost:3000/src/css/component.css http://localhost:3000/src/css/component.css不是 已加载，因为其 MIME 类型“text/html”不是“text/css”

错误的原因是，

当浏览器上提供服务时，您只能访问公共目录，因此

-> 第一../src/css/通过这种方式你无法访问该文件，它会认为这是路由并尝试给你html

-> 其次，这不是包含 css 文件的正确方法：

<link rel="stylesheet" type="text/css" href="../src/css/normalize.css" />
<link rel="stylesheet" type="text/css" href="../src/css/demo.css" />
<link rel="stylesheet" type="text/css" href="../src/css/component.css" />

正确使用css文件的方法是这样的（来自您的 React 组件 js 文件）：

import './css/component.css';

(react-scripts start) React 会自动将你的 css 文件转换为 js 并应用。

如果你想在react之外使用css文件，你需要将所有css文件放在public文件夹中（最好放在public/css中）

<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css" />
<link rel="stylesheet" type="text/css" href="css/component.css" />

如果您仍有疑问，请阅读：

https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started

希望这能消除您所有的疑虑。