我想在我的项目中开始使用 Bourbon 和 Neat Sass 库。我想使用 Gulp 编译 Sass。以下是一个简单的 styles
任务设置,我在其中一个教程中找到:
var gulp = require('gulp'),
sass = require('gulp-sass'),
neat = require('node-neat').includePaths;
var paths = {
scss: './assets/styles/*.scss'
};
gulp.task('styles', function () {
return gulp.src(paths.scss)
.pipe(sass({
includePaths: ['styles'].concat(neat)
}))
.pipe(gulp.dest('./dist/styles'));
});
gulp.task('default', function () {
gulp.start('styles');
});
然后在主要的.scss
文件中,我放置了导入:
@import "bourbon";
@import "base/base";
@import "neat";
这个任务执行得正确。
让我困惑的是includePaths
到底是做什么的?
基于上面的例子,有人能解释一下includePath
的作用吗?
neat = require('node-neat').includePaths;
,includePaths: ['styles'].concat(neat)
。 - luqo33styles
是用于解析你的SASS文件中的@import语句的文件夹。neat
变量包含了一个额外路径的数组,用于解析neat
的SASS文件中的路径。尝试在gulp中添加gutil.log(neat)
,查看被添加的路径(参见https://dev59.com/sl4c5IYBdhLWcg3wYpjq#27975742以了解如何添加gutil)。我们使用concat将它们合并在一起,得到['styles',<neat的文件夹1>,<neat的文件夹2>,<neat的文件夹3>,... <neat的最后一个文件夹>]
。 - James Lawsonrequire
的语法感到困惑,您应该阅读有关“Common JS 模块”的内容,特别是“module.exports”一词的含义。像 (node-neat) 这样的 NPM 包使用这种表示法。 node-neat 模块正在 导出 includePaths。 - James LawsonincludePaths
时,谈论loadPaths
。这就是典型的StackOverflow。 - Yeats