我试图让node-sass-middleware与express一起工作。该应用程序运行时没有错误
...(modules)
var sassMiddleware = require('node-sass-middleware');
var routes = require('./routes/index');
var app = express();
// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
//---- LOAD SASS -----//
// adding the sass middleware
var srcPath = __dirname + '/scss';
var destPath = __dirname + '/public/stylesheets';
app.use(sassMiddleware({
src: srcPath,
dest: destPath,
debug: true,
outputStyle: 'compressed'
}));
app.use(express.static(path.join(__dirname, 'public')));
任何人都可以看到我试图编译sass的方式有什么问题吗?
文件结构:
app
controllers
routes
public
-stylesheets
scss
...
答案 0 :(得分:8)
app.js应该是这样的:
app.use(sassMiddleware({
src: srcPath,
dest: destPath,
debug: true,
outputStyle: 'compressed'
}),
express.static(path.join(__dirname, 'public')));
此外,您的主要scss文件应命名为style.scss,并且位于scss / stylesheets /目录中。
如果您已正确加载模块,您应该会看到这样的日志:
source : /Users/abc/Desktop/SO/SO_node/scss/stylesheets/style.scss
dest : /Users/abc/Desktop/SO/SO_node/public/stylesheets/stylesheets/style.css
read : /Users/abc/Desktop/SO/SO_node/public/stylesheets/stylesheets/style.css
render : /Users/abc/Desktop/SO/SO_node/scss/stylesheets/style.scss
答案 1 :(得分:3)
问题也可能是您要编译scss
而不是sass
。因此,请将indentedSyntax
设置为false
。
app.use(require('node-sass-middleware')({
src: path.join(__dirname, 'scss'),
dest: path.join(__dirname, 'public'),
indentedSyntax : false,
sourceMap: true
}));
或完全删除它。 Express-generator在默认情况下添加此值。
答案 2 :(得分:0)
最好选择 grunt-sass 。简单的配置,自动化的任务(由于grunt)以及由于 libsass 而更快的编译时间,这是SASS的原始Ruby编译器的C版本。在0.3秒而不是3秒内编译sass / scss文件。