node-sass-middleware 只提供一次 css 文件

我使用 Jade 和 Sass 制作了一个非常简单的 Express 网站，但是我的 node-sass 中间件遇到了问题。我的服务器只提供一次 CSS 文件，然后为每个后续请求返回 404。我必须重新启动服务器才能暂时修复它。这是我的代码；服务器似乎在输出 css 文件后挂起（也许，我不确定..）

app.js:

var express = require('express'), sassMiddleware = require('node-sass-middleware');

var app = express();

app.set('views', __dirname + '/views');
app.set('view engine', 'jade');

app.use(
    sassMiddleware({
        src: __dirname + '/public/styles/sass',
        dest: __dirname + '/public/styles',
        debug: true,
        outputStyle: 'compressed',
        prefix: '/public/styles'
    }),
    express.static(__dirname + '/public'),
    express.logger('dev')
);

app.get('/', function(req, res){
    res.render('index', { 
        title: 'Home' 
    });
});

app.listen(3000);

这是我的服务器的日志：

source: /Users/jasonzhao/Code/Github/isitjoysbirthday/public/styles/sass/main.scss
dest: /Users/jasonzhao/Code/Github/isitjoysbirthday/public/styles/main.css
read: /Users/jasonzhao/Code/Github/isitjoysbirthday/public/styles/main.css
render: /Users/jasonzhao/Code/Github/isitjoysbirthday/public/styles/sass/main.scss

source: /Users/jasonzhao/Code/Github/isitjoysbirthday/public/styles/sass/main.scss
dest: /Users/jasonzhao/Code/Github/isitjoysbirthday/public/styles/main.css

日志的前 4 行来自我的第一个请求，接下来的两行来自我的第二个请求（刷新页面），该请求失败了。

最后，这是我的 Jade 模板

doctype
html
  head
    title #{title} - isitjoysbirthday
    link(rel='stylesheet', href='/public/styles/main.css')
  body
    .container
      .main-content
        block content

Thanks!

我意识到这是一个老问题，不久前可能已经通过其他方式得到了回答，但我看到了类似的问题，只是想回答一下以记录在案。如果您提供的是public文件夹那么你的文件路径实际上应该是/styles/main.css。改变你的prefix选项只是/styles和你的 HTML<link href='/styles/main.css'>.

这是我的一个有效的示例设置。

目录结构：

static
  |
  - css
  |
  - scss

中间件设置：

  app.use(sassMiddleware({
    src: __dirname + '/static/scss',
    dest: __dirname + '/static/css',
    debug: false,
    prefix: '/css',
    outputStyle: 'compressed'
  }));
  app.use('/', serveStatic('./static', {}));

HTML:

<link rel='stylesheet' href='/css/app.css'>

Bonus:

serveStatic将始终在以下时间提供此服务：/css/my_css_file.css，但问题是中间件如何与 HTML 链接本身交互。每当请求静态文件时，它都会查看它附带的文件路径并将其粘贴到静态文件的末尾src and dest网址。这是如果你没有定义一个prefix根本没有选择。

Without prefix:

With prefix:

The prefix简单地忽略了/css我的 CSS 的一部分<link>URL 并允许绝对路径准确src and dest.