如何使用Mean.io安装SASS？

Question

我有一个基本的MEAN.io设置。让我困惑的是包裹的结构。我希望在最终版本中使用.scss文件并将SASS编译成.css文件，但我并不100%确定这是如何工作的，因为我只是想了解一下。

我已经阅读了MEAN.io团队提供的关于如何使css文件“全局”的文档，但我仍然不知道如何预处理.scss文件。

我没试过多少，因为我不知道该怎么做。默认情况下，MEAN.io似乎使用了Gulp。我从来没有收到一个提示，问我是更喜欢Gulp还是Grunt (如MEAN.io的博客所示)。

任何帮助或例子都会很有帮助。我看过谷歌，但我发现的大部分东西都是MEAN.js的。:(

谢谢!

Answer 1

要处理.scss文件，您几乎可以复制较少的配置。

1. 安装吸管 npm install gulp-sass --save-dev
2. 更新gulp/development.js paths = { ... sass: [ 'packages/**/*.scss', '!packages/**/node_modules/**', '!packages/**/assets/**/lib/**'], ... };
3. 创建一个gulp任务来运行sass gulp.task('sass', function() { return gulp.src(paths.sass) .pipe(plugins.sass().on('error', plugins.sass.logError)) .pipe(gulp.dest('./packages')); });
4. 此时，您应该能够运行gulp sass，并且它应该能够工作，但是为了让它在运行gulp时运行和查看文件，请参见下面两个步骤。
5. 向defaultTasks中添加gulp任务(如果您愿意，可以删除更少的内容) var defaultTasks = ['coffee','clean', 'less', 'sass', 'csslint', 'devServe', 'watch'];
6. 添加监视任务 gulp.task('watch', function () { ... gulp.watch(paths.sass, ['sass']); });