Gulp-sass 不会编译成 CSS

Posted 2023-03-07

【中文标题】Gulp-sass 不会编译成 CSS

【英文标题】：Gulp-sass will not compile to CSS

【发布时间】：2015-02-09 07:50:39

【问题描述】：

我无法让 grunt-sass 编译为 .css。看过很多其他类似的帖子并使用了建议，但似乎没有任何效果。

我可以让其他插件正常工作（例如，'del' 删除内容，显示在这里）所以我的环境似乎没问题，我可以让普通的 vanilla sass 编译/监视正常工作。

这是我的设置以防万一：

OSX Maverics 10.9.5

$ ruby -v
ruby 2.0.0p481 (2014-05-08 revision 45883) [universal.x86_64-darwin13]

$ sass -v
Sass 3.4.9 (Selective Steve)

$ npm -v
2.1.12

$ brew -v
Homebrew 0.9.5

项目目录结构如下：

    ├── index.html
    │   
    ├── scss
    │    └── base.scss
    │          ├── _partial1.scss
    │          └── _partial2.scss
    │
    ├── assets
    │      └── css
    │           └── Nothing yet!
    │
    ├── deltest
    │    └── save.txt
    │
    ├── gulpfile.js
    │
    └── node_modules
         └── etc ...

这是我的 gulpfile.js：

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

gulp.task('gsas', function() 
    gulp.src('./scss/base.scss')
        .pipe(sass( includePaths : ['./scss/'] ))
        .pipe(gulp.dest('./assets/css'))
);

del(['!deltest/save.txt', 'deltest/delete.txt'], function (err, deletedFiles) 
    console.log('Files deleted:', deletedFiles.join(', '));
);

gulp.task('default', function() 
    console.log('AAAAAAAAAAAAAAAARGH!');
);

谁能看出这里出了什么问题？

---

已更新 - 相同的任务在 windows 框中静默失败：

这是来自 windows box 测试的 gulpfile.js，我什至没有 @importing 任何部分（目录结构 完全是，如任务设置中所示，我直接从实际中提取插件示例）：

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

gulp.task('sass', function () 
    gulp.src('./scss/*.scss')
        .pipe(sass())
        .pipe(gulp.dest('./css'));
);

del(['delete/delete.txt', '!delete/save.txt'], function (err, deletedFiles) 
    console.log('Files deleted:', deletedFiles.join(', '));
);

gulp.task('default', function () 
    console.log("Made it!");
);

在这个示例中，我再次让“del”任务运行良好，但 gulp-sass 默默地失败了，这真的令人困惑。

【问题讨论】：

可能您应该将_partial1.scss 和其他导入base.scss (@import "partial1") 并从sass 编译器中删除includePath。我想，它会对你有所帮助。

部分已经通过@import 导入。尝试了删除 includePath 的另一种选择，将其简化为熊的必需品，但恐怕没有乐趣。整个shebang都完成了默认任务，所以这让我有点发疯！不过谢谢

您是否收到任何错误消息？

嘿@Ben 不，它默默地失败了。我编辑了我的原始帖子以反映我在一个 Windows 框上所做的测试，该测试也默默地失败了，你能看看编辑吗？

如果有帮助，在 windows 框中设置如下：npm -v：1.4.28，sass -v：3.4.9（选择性史蒂夫），gulp -v：CLI 版本 3.8。 10

【参考方案1】：

如果您希望在从命令行运行 gulp 时执行 sass 任务，请将其添加为 default 任务的依赖项：

gulp.task('default', ['sass'], function() 
  //other stuff
);

【讨论】：

感谢@Ben 刚刚在 Mac 上运行它，一切都很好。还适当地注意到了默认的依赖关系。为您的帮助干杯！