在服务器上找不到 CSS 样式表？
Posted
技术标签:
【中文标题】在服务器上找不到 CSS 样式表？【英文标题】：CSS stylesheet not found on server? 【发布时间】：2017-03-04 02:31:34 【问题描述】：我正在使用 react/webpack 在本地 8080 上运行开发服务器。这是我还不太了解的东西，我之前遇到过这个问题。 Bootstrap 在 html 中被链接并且运行良好。但是，当我链接样式表时，控制台给我一个错误 404 not found for my stylesheet。
这是我的 HTML 样板：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Weather App</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="public/stylesheet.css" />
</head>
<body>
<div id="root">
</div>
</body>
</html>
Index.html 和 Index.js 在根目录，/Public 目录也是如此，它只包含一个文件：stylesheet.css。
为什么当我运行本地服务器时 stylesheet.css 没有加载到浏览器中，我该如何解决这个问题？谢谢。
【问题讨论】：
你试过Public/stylesheet.css 吗？ （大写 P）- 一些服务器（查看 IIS）区分大小写
谢谢！正如您在上面的示例中看到的那样，我之前尝试过 public，但是 Public 目录不在项目的 TRUE 根目录中。它在 App 目录中。我将公共目录移到了真正的根目录（使用 webpack 配置和节点模块）并且它工作了！
这样做有什么原因吗？浏览器是否只希望 Public 文件夹位于真正的根目录中？
我不确定 webpack 的内部工作原理，但浏览器并不“期待”任何东西。浏览器去寻找你告诉它找到的文件；在这种情况下：<application_root>/public/stylesheet.css 或在远程服务器的位置，例如：https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css - 更新： 在这种情况下，public 定义为与html 文件处于同一级别的目录.
【参考方案1】：
如果您像这样使用 express 共享公用文件夹
app.use(express.static(path.join(__dirname, 'public')));那么您不需要在源中包含“public”。
换句话说就是这个
<link rel="stylesheet" href="public/stylesheet.css" />应该是这样的
<link rel="stylesheet" href="/stylesheet.css" />【讨论】：
以上是关于在服务器上找不到 CSS 样式表？的主要内容，如果未能解决你的问题，请参考以下文章
关于ProcessOn在线做图工具上找不到宋体，黑体字体样式的解答
在 PRESTASHOP 的多存储 URL 上找不到所有 CSS 和 JS 文件