我有一个基本的 MEAN.io 设置。令我困惑的是包结构。我想在最终版本中使用 .scss
文件并将 SASS 编译成 .css
文件,但我不是 100% 确定它是如何工作的,因为我'我只是想学习。
我已经阅读了 MEAN.io 团队提供的关于如何使 css 文件“全局化”的文档,但我仍然不确定如何预处理 .scss
文件。
我没有尝试太多,因为我不确定该怎么做。 MEAN.io 似乎默认使用 Gulp。我从未收到询问我更喜欢 Gulp 还是 Grunt 的提示(如 MEAN.io 的博客所示)。
任何帮助或示例都会非常有帮助。我查看过 Google,但我发现的大部分内容都是 MEAN.js 的内容。 :(
谢谢!
最佳答案
要处理 .scss
文件,您几乎可以复制 less 配置。
安装 gulp sass
npm install gulp-sass --save-dev
更新 gulp/development.js
路径 = { ... 萨斯:[ '包/**/*.scss', '!packages/**/node_modules/**', '!packages/**/assets/**/lib/**'], ... };
创建一个运行 sass 的 gulp 任务
gulp.task('sass', function() { 返回 gulp.src(paths.sass) .pipe(plugins.sass().on('error', plugins.sass.logError)) .pipe(gulp.dest('./packages')); });
此时您应该能够运行
gulp sass
并且它应该可以工作,但是为了让它在您运行gulp
时运行并查看文件,请参阅接下来的两个步骤。将 gulp 任务添加到 defaultTasks(如果需要,可以删除 less)
var defaultTasks = ['coffee','clean', 'less', 'sass', 'csslint', 'devServe', 'watch'];
添加监视任务
gulp.task('watch', function () { ... gulp.watch(paths.sass, ['sass']); });
关于css - 如何使用 Mean.io 安装 SASS?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33484838/