Heroku/Node.js - 部署不加载 CSS？答案

【问题标题】：Heroku/Node.js - Deploying does not load CSS?Heroku/Node.js - 部署不加载 CSS？
【发布时间】：2015-11-04 17:40:50
【问题描述】：

我正在尝试使用 node.js 将站点部署到 Heroku，但遇到了一些问题。当我在本地运行我的网站时，它看起来和我预期的一样。但是，一旦我将它部署到 Heroku，它似乎无法识别我包含的 CSS 文件，尽管它使用的是完全相同的文件和文件结构。

我已确认我的 HTML 和 CSS 代码在语法上是正确的，并且 CSS 文件正在通过 Git 推送。我通过更改 CSS 中的一件事来确保它被推送（确实如此）来提交。

这是我访问 CSS 文件的方式：

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

这是网站在本地（左）和部署在 Heroku（右）上的图像，使用相同的确切代码（黑框只是我掩盖了一些个人详细信息）。

有谁知道 Heroku 拒绝使用我的 CSS 的原因吗？我绞尽脑汁想了 2 天，无法弄清楚。

【问题讨论】：

您是否尝试过通过浏览器的地址栏访问 Heroku CSS 文件？你确定 CSS 文件已经被部署了吗？ ...当您加载页面时，您可能会收到 HTTP 404 错误（找不到文件）？尝试在浏览器中打开 Web Inspector 并查看是否有任何 404 错误。
我没有收到 404 错误，而是它只是加载网站，唯一的变化是附加到 URL 的“/style.css”。网页内容没有变化，CSS文件也没有显示出来。检查器显示 style.css 有 0 条规则，所以我可以假设 Heroku 没有应用它（尽管 Git 说文件已被推送）。

【解决方案1】：

我遇到了完全相同的问题，只是我在整个代码中漏掉了一个字符。让我解释一下

当我 heroku 打开我的项目时，没有加载 css，但有趣的是 jquery 工作正常，jquery 从 css 文件中获取的 css 也很好。 css文件不是问题。

然后我发现浏览器屏蔽了一些 content。如果您告诉浏览器无论如何都要读取被阻止的内容，它将显示该页面没有问题，但它会显示一个带有可怕红线的 https，而不是一个选项。然后我检查了浏览器阻止了哪些内容 (blocked content) 这是我的引导链接。

所以我将引导程序与 http 而不是 https 链接。我添加了那个字母 s，它现在可以正常工作了。

【讨论】：