node-sass不使用node / express进行编译 [英] node-sass not compiling with node / express

问题描述

我正在尝试使用快捷方式来获取node-sass，我根本无法做任何编译。这是我的app.js文件：

I'm trying to get node-sass working with express, and I simply can't get it to do any compiling at all. This is my app.js file:

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 文件我放在sass目录中没有什么是编译。有没有更多的东西，我需要超越 node app.js ？

I have public/sass and public/stylesheets, yet no matter what .scss files I place in the sass directory nothing is getting compiled. Is there something more that I need to run beyond node app.js?

我真的很接近并且只需安装sass宝石，并保持一个额外的标签打开来观看目录。

I'm really close to giving up and just install the sass gem and keeping an extra tab open to watch the directory.

推荐答案

这是令人困惑的Stylus中间件（它被启发，它说）。

It's as confusing as the Stylus middleware (by which it is inspired, it says).

src 的文件夹结构应该模仿最终的结构目的地和您用来请求CSS文件的路径。如果你想要这样存储你的CSS文件：

The folder structure of src should mimic the eventual structure of the destination and the path you're using to request the CSS file. If you want your CSS files to be stored like this:

./public/stylesheets/app.css

访问该文件的URL将是：

And the URL to access the file will be:

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

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

You need to configure the middleware like this:

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

您的SASS文件夹结构如下：

And your SASS folder structure like this:

./public/sass/stylesheets/app.scss

我相信它的工作原理如下：

I believe it works like this:

• 采取HTTP请求的路径： / stylesheets /app.css


• 找到SCSS文件，将URL路径连接到 src 并替换扩展名： ./ public / sass / stylesheets / app.scss


• 为目的地，将URL路径连接到 dest ： ./ public / stylesheets / app.css

• take the path of the HTTP request: /stylesheets/app.css
• to find the SCSS file, concatenate the URL path to src and replace extension: ./public/sass/stylesheets/app.scss
• for the destination, concatenate the URL path to dest: ./public/stylesheets/app.css

这篇关于node-sass不使用node / express进行编译的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！