代码之家  ›  专栏  ›  技术社区  ›  Beau D'Amore

Visual Studio 2015和Gulp:获取所有子目录中的所有文件

  •  1
  • Beau D'Amore  · 技术社区  · 8 年前

    我遇到了一个问题,Gulp没有获取/引用它需要的所有文件,并且出错了。这对不再与我们合作的前开发人员有效。吞咽法出现了参考误差。它似乎无法“看到”Assets文件夹中的任何子目录。

    错误如下:

    [08:47:38] Using gulpfile C:\Development...\Gulpfile.js
    [08:47:38] Starting 'icons'...
    [08:47:38] Finished 'icons' after 48 ms
    [08:47:38] Starting 'sass'...
    events.js:160
      throw er; // Unhandled 'error' event
      ^
    Error: Assets\sass\styles.scss
    Error: File to import not found or unreadable: bootstrap
       Parent style sheet: C:/Development/***... on line 5 of     Assets/sass/styles.scss
    >> @import 'bootstrap';
    

    以下是我的相关吞咽脚本:

    gulp.task('sass', ['icons'], function() {
    return gulp.src('./Assets/sass/styles.scss')
        .pipe(sourcemaps.init())
        .pipe(sass({
            includePaths: [
            'bower_components/bootstrap/scss',
            'bower_components/font-awesome/scss',
            'bower_components/bootstrap4-chosen'
            ]
        }))
        .pipe(concat('styles.css'))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest('./wwwroot/css'))
        .pipe(browserSyncStream());
    });
    

    样式.scss:

    // Base vendors and variables
    @import 'font-awesome';
    @import 'variables';
    @import 'bootstrap';
    
    // Mixins, utilities and base styles
    @import 'mixins';
    @import 'utilities';
    @import 'base';
    

    以下是文件夹结构:

    folder structure

    更改样式中的@import。scss发送至:

    @import '../../bower_components/bootstrap/dist/css/bootstrap.css';
    

    给我一个不同的错误:

    > Error: Undefined variable: "$font-size-lg".
        on line 38 of Assets/sass/_layout.scss
    >>      font-size: $font-size-lg;
    

    这里似乎缺少了更多的引用……我认为gulp脚本并不是通过递归搜索所有子文件夹来获取所有文件……我该如何巧妙地做到这一点?还是还缺什么?

    1 回复  |  直到 8 年前
        1
  •  1
  •   Sven Schoenung    8 年前

    你的没有问题 sass 任务尝试过了。作品

    我猜您的同事正在使用即将发布的 bootstrap 4.0.0 但您已经安装了bootstrap 3.x。当前 bootstrap 3.3.6 没有 scss 文件夹,因为它仍在使用 less .如果您只是 bower install bootstrap 你得到3.3.6。

    确保您的 bower.json :

    "dependencies": {
      "bootstrap": "4.0.0-alpha.2"
    }
    

    或使用以下命令直接安装引导程序4.0.0:

    bower install bootstrap#4.0.0-alpha.2