为什么React Rendered Pages被忽略的CSS文件

Question

我有一个使用create-react-app创建的React应用程序，该应用程序链接到我的CSS文件，如下面的index.html文件所示：

<link rel="stylesheet" href="../src/site.css"></link>

site.css在下面实现：

body {
  background-color: green;
  height:100%;
  width:100%; 
}

当我的应用程序运行时，它不会将样式应用于正文。我可以看到正在下载css文件。

Answer 1

{-1}}目录不与create-react-app一起提供。您需要将CSS文件移动到src目录或从其中一个JavaScript文件中导入。

在内部，所有内容都使用Webpack与理解样式表的加载器捆绑在一起，因此处理此问题的最简单方法是从public文件中删除链接标记，然后将以下导入添加到public/index.html文件中：

src/index.js

或者，如果您确实需要从html文件链接到样式表，可以将其移至import "./site.css"; 并更改链接标记以引用它：

public/site.css