Gulp Sass 导入路径不正确

Question

我的 gulp 构建文件与 sass 导入有问题。

我正在使用 gulp-importify 创建一个 build.scss 文件，其中包含我的依赖项、第三方 css 和我的自定义 css 的正确顺序。

Importify 任务

module.exports = function() {
  APP.gulp.src(APP.concat.sass)
  .pipe(APP.tasks.importify('build.scss', {
    cssPreproc: 'scss'
  }))
  .pipe(APP.gulp.dest('build/sass/'));
};

我的文件夹结构如下：

gulp
 - bower_components
 - build
   - sass
     - build.scss
     - modules
       -forms.scss

包含导入的 build.scss 文件具有以下路径

@import "_bootstrap-sprockets";

@import "variables.scss";

@import "modules/form.scss";

但是 bower 组件返回了两个目录。

@import "../../bower-components/bootstrap-sass/assets/stylesheets/_bootstrap-sprockets";

@import "variables.scss";

@import "modules/form.scss";

是否有任何其他方式或方法可以在 Gulp 中设置完整的 relative/correct 导入路径？

Answer 1

我找到了解决方案。我通过 gulp.src 添加了一个基本路径，如下所示：

module.exports = function() {
  APP.gulp.src(APP.concat.sass, 
    {base: 'build/sass'})
  .pipe(APP.tasks.imports('build/sass/build.scss', {
    cssPreproc: 'scss'
  }))
  .pipe(APP.gulp.dest('.'));
};

您还可以使用 Node 中可用的全局进程对象来获取当前工作目录。所以你可以将基数设置为：

{base: process.cwd() }

Gulp Sass 导入路径不正确

Gulp Sass Import Paths Incorrect

gulp

gulp-sass