如何使用Mean.io安装SASS？

Question

我有一个基本的MEAN.io设置。令我困惑的是包结构。我想在最终版本中使用.scss文件并将SASS编译成.css个文件，但我不能100％确定这是如何工作的，因为我只是试着学习。

我已经阅读了MEAN.io团队提供的文档，关于如何制作css文件＆＃39; global＆＃39;，但我仍然不确定如何预处理.scss文件。

我没有尝试过多少，因为我不确定该怎么做。 MEAN.io似乎默认使用Gulp。我从未收到提示，询问我是否更喜欢Gulp或Grunt（如MEAN.io博客中所示）。

任何帮助或示例都会非常有用。我看过谷歌，但我发现的大多数东西都是MEAN.js的东西。 :(

谢谢！

Answer 1

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

1. 安装gulp sass

   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. 将gulp任务添加到defaultTasks（如果需要，可以删除少量）

   var defaultTasks = ['coffee','clean', 'less', 'sass', 'csslint', 'devServe', 'watch'];

6. 添加观看任务

   gulp.task('watch', function () { ... gulp.watch(paths.sass, ['sass']); });