問題描述

Libsass 2.0 為 libsass 用戶帶來了縮進語法，但到目前為止，我還無法使其與 node-sass 和 gulp-sass 一起使用.我有所有最新版本:

node-sass:0.93
gulp-sass:0.7.2
吞咽:3.8.2

此設置使用括號語法編譯 .scss 文件甚至 .sass 文件，但不會編譯縮進語法.有人用 node-sass 和 gulp 成功編譯了縮進語法嗎?

我的 gulpfile.js

var gulp = require('gulp');var sass = require('gulp-sass');gulp.task('sass', function() {返回 gulp.src('./sites/all/themes/nsfvb/sass/screen.sass').pipe(薩斯({includePaths: require('node-neat').includePaths,errLogToConsole: 真})).pipe(gulp.dest('./sites/all/themes/nsfvb/css'));});gulp.task('watch', function() {gulp.watch('./sites/all/themes/nsfvb/sass/*.sass', ['sass']);});gulp.task('default', ['sass', 'watch']);

運行默認任務時出錯

錯誤:無效的頂級表達式

更新答案:

如果您想使用縮進語法 (.sass) 作為頂級文件，請使用 sass({indentedSyntax: true}).

sass({indentedSyntax: true})

過時的答案

在這里找到答案:https://github.com/dlmanning/gulp-sass/issues/55#issuecomment-50882250

使用默認設置編譯 sass 文件不起作用.但是，有一種解決方法.如果您通過 sourceComments: 'normal' 作為參數編譯工作.原因是有一個奇怪的條件改變了文件的處理方式:https://github.com/dlmanning/gulp-sass/blob/master/index.js#L23-L27

此處的代碼示例:https://github.com/chrisdl/gulp-libsass-example/blob/master/gulpfile.js

var gulp = require('gulp');var sass = require('gulp-sass');//在終端中使用> gulp sass"運行.gulp.task('sass', function () {gulp.src('./sass/main.sass').pipe(sass({sourceComments: 'normal'})).pipe(gulp.dest('./css'));});

通知

如果您在使用此代碼段時遇到問題，請查看以下引用和問題.

使用此解決方法將導致 gulp 管道中早期文件內容的任何更改(例如早期插件)被丟棄 - JMM

https://github.com/dlmanning/gulp-sass/issues/158

Libsass 2.0 brought the indented syntax to libsass users, but so far I've been unable to make it work with node-sass and gulp-sass. I have all of the latest versions:

node-sass: 0.93
gulp-sass: 0.7.2
gulp: 3.8.2

This setup compiles .scss files and even .sass files using the bracket syntax but it will not compile the indented syntax. Has anyone successfully compiled the indented syntax with node-sass and gulp?

My gulpfile.js

var gulp = require('gulp');
var sass = require('gulp-sass');

gulp.task('sass', function() {
    return gulp.src('./sites/all/themes/nsfvb/sass/screen.sass')
        .pipe(sass({
            includePaths: require('node-neat').includePaths,
            errLogToConsole: true
        }
        ))
        .pipe(gulp.dest('./sites/all/themes/nsfvb/css'));
});

gulp.task('watch', function() {
    gulp.watch('./sites/all/themes/nsfvb/sass/*.sass', ['sass']);
});

gulp.task('default', ['sass', 'watch']);

Error when running the default task

error: invalid top-level expression

Updated answer:

If you want to use the indented syntax (.sass) as the top level file, use sass({indentedSyntax: true}).

sass({indentedSyntax: true})

Outdated answer

Answer found here: https://github.com/dlmanning/gulp-sass/issues/55#issuecomment-50882250

With default settings compiling sass files doesn't work. However there is a workaround. If you pass sourceComments: 'normal' as parameter the compilation work. The reason for this is that there is a strange condition which change how file are handled: https://github.com/dlmanning/gulp-sass/blob/master/index.js#L23-L27

Code example found here: https://github.com/chrisdl/gulp-libsass-example/blob/master/gulpfile.js

var gulp = require('gulp');
var sass = require('gulp-sass');

// Run with "> gulp sass" in terminal.
gulp.task('sass', function () {
gulp.src('./sass/main.sass')
    .pipe(sass({sourceComments: 'normal'}))
    .pipe(gulp.dest('./css'));
});

Notice

If you run into issues using this snippet take a look at the following quote and issue.

Using this workaround will result in any changes to the file content from earlier in the gulp pipeline (e.g. earlier plugins) being discarded - JMM

https://github.com/dlmanning/gulp-sass/issues/158

這篇關于縮進的 Sass 語法不適用于 node-sass 和 gulp-sass的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！