node-sass无法与node / express编译

Question

我正在尝试让node-sass与express配合使用，但无论如何我都无法使其正常编译。这是我的app.js文件：

var express = require('express')
  , sass = require('node-sass')
  , routes = require('./routes')
  , user = require('./routes/user')
  , http = require('http')
  , path = require('path');

var app = express();

app.configure(function(){
  app.set('port', process.env.PORT || 3000);
  app.set('views', __dirname + '/views');
  app.set('view engine', 'ejs');
  app.use(sass.middleware({
     src: __dirname + '/public/sass',
     dest: __dirname + '/public/stylesheets', 
     debug: true
  }));
  app.use(express.favicon());
  app.use(express.logger('dev'));
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(express.cookieParser('your secret here'));
  app.use(express.session());
  app.use(app.router);
  app.use(express.static(path.join(__dirname, 'public')));
});

app.configure('development', function(){
  app.use(express.errorHandler());
});

app.get('/', routes.index);
app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), function(){
  console.log("Express server listening on port " + app.get('port'));
});

我有一个 public/sass 和 public/stylesheets 文件夹，但无论我将 .scss 文件放在哪里，都没有进行编译。除了运行 node app.js，我还需要做些什么吗？

我真的很想放弃，直接安装sass gem并保持额外的标签页来监视目录。

- bjork24

Answer 1

它像Stylus中间件一样令人困惑（它说自己是受其启发而来）。

src文件夹结构应该模仿目标文件夹的最终结构和你用于请求CSS文件的路径。如果你希望将CSS文件存储如下：

./public/stylesheets/app.css

访问文件的URL将是：

http://.../stylesheets/app.css

你需要像这样配置中间件：

app.use(sass.middleware({
   src:   __dirname + '/public/sass',
   dest:  __dirname + '/public',
   debug: true
}));

你的SASS文件夹结构应该是这样的：

./public/sass/stylesheets/app.scss

我认为它的工作原理是这样的:

• 获取HTTP请求路径：/stylesheets/app.css
• 查找SCSS文件，将URL路径连接到src并替换扩展名：./public/sass/stylesheets/app.scss
• 对于目标路径，将URL路径连接到dest：./public/stylesheets/app.css

- robertklep

---

这很有道理，但不幸的是它仍然无法工作。SCSS文件仍然无法编译。 - bjork24

我使用了你的代码（gist）并且它运行得很好（包括在SCSS文件更改时重新渲染）。也许是权限问题？ - robertklep

真的很奇怪。我有相同的设置和目录结构，但它对我来说根本不起作用。哦，算了吧。我只是继续使用我的compass gem。 - bjork24

你是在尝试使用SASS文件还是SCSS文件？node-sass只能处理SCSS文件，因为它下面的C库libsass只支持SCSS。要将SASS功能添加到libsass中可能需要大量工作，而且每个人的时间都很短。 - juanpaco

我也在做类似的事情，但它还没有达到“渲染”阶段：https://gist.github.com/CLUSTERfoo/7585484 - o_o_o--

我正在使用Stylus，这解决了我的问题。绝对不可能想到他们是如何处理路径的!!! - Paul Chernoch

Answer 2

尝试使用前缀选项：

app.use(sass.middleware({
    src: __dirname + '/public/sass',
    dest: __dirname + '/public', 
    prefix:  '/stylesheets'
    debug: true
}));

- linuxdan

Answer 3

我遇到了与node-sass中间件相关的类似问题。最终我放弃了，尝试使用 asset-rack，但直到我开始使用这个分支时，它也无法正常工作：https://github.com/techpines/asset-rack/pull/76 由于asset-rack分支的拉取请求已经悬而未决了11个月，我感到非常沮丧，最终只好编写了自己的静态文件中间件，称为Electricity，支持Sass以及其他一些不错的功能。

- Shawn Miller