Pug 文件未加载 CSS答案

【问题标题】：Pug file not loading CSSPug 文件未加载 CSS
【发布时间】：2017-06-28 01:06:52
【问题描述】：

我已经建立了一个快速项目。我使用 Pug 作为视图引擎。

我的 app.js 中有以下几行，

app.set('views', path.join(__dirname, './views'));
app.set('view engine', 'pug');
app.use(express.static(path.join(__dirname, './public')));

我的 index.pug 视图中有以下内容，

    link(rel='stylesheet', href='/stylesheets/style.css', type='text/css')
    link(rel='stylesheet', href='/stylesheets/boostrap.min.css', type='text/css')

CSS 文件位于正确的文件夹（public/stylesheets）中，但是当我加载应用程序时，视图似乎没有加载 CSS 文件。

可以在here找到完整的项目及其目录和所有代码

【问题讨论】：

标签： css node.js express pug

【解决方案1】：

在您的引导链接中输入错误，您有 boos陷阱：

link(rel='stylesheet', href='/stylesheets/boostrap.min.css', type='text/css')

【讨论】：

我收到此错误拒绝应用的样式，因为它的 MIME 类型（'text/html'）不是受支持的样式表 MIME 类型，并且启用了严格的 MIME 检查。

【解决方案2】：

我的代码正在使用这个

doctype html
html(lang='en')
  head
    link(rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous")

    title Jade
  body
    h1 Jade - node template engine

【讨论】：

【解决方案3】：

如果您使用的是 pug 2.* 或更高版本，下面的代码将起作用

html
    head
        style
             include ./style.css
    body

【讨论】：

【解决方案4】：

我遇到了类似的问题，加载了引导文件，但代码对任何引导类都没有影响。问题是我在 rel 属性上有错字。我有 stytesheet 而不是 stylesheet

link(rel='stylesheet', href='/stylesheets/bootstrap.min.css')

【讨论】：