Grunt-injector如何忽略Bower依赖中的CSS文件

Question

我正在一个新项目中使用 grunt-injector。它被设置为将所有bower依赖项添加到index.html文件中。

我的依赖项中有ionic，我只使用它的javascript文件而不是css文件。所以我希望grunt-injector不要在我的项目中添加ionic css文件。

以下是我的配置：

injector: {
  options: {
    addRootSlash: false,
    ignorePath: 'app/',
    bowerPrefix: 'bower',
  },
  bowerDependencies: {
    files: {
     'app/index.html': ['bower.json'],
  }
}

我可以通过修改ionic/bower.json文件来完成这个任务:

"main": [
  //"css/ionic.css",
  "fonts/*",
  "js/ionic.js",
  "js/ionic-angular.js"
]

当然，我更希望不这样做。

- leseulsteve

Answer 1

可能有帮助，但我发现gulp-injector只是在<!-- bower:css --> ... <!-- endbower -->之间编译所有的CSS文件。

另一个任务负责读取我的bower文件并编辑index.html，它是wiredep插件。

所以如果像我一样使用了一个已经准备好的脚手架，请查找这个任务（在这里是gulp）：

gulp.task('wiredep', function() {
    log('Wiring the bower dependencies into the html');

    var wiredep = require('wiredep').stream;
    var index = paths.client + 'index.html';

    return gulp.src(index)
        .pipe(wiredep({
            directory: './bower_components/',
            bowerJson: require('./bower.json'),
            exclude: ['bower_components/foundation/css/foundation.css',
                        'bower_components/toastr/toastr.css'],
            ignorePath: '../..' // bower files will be relative to the root
        }))
        .pipe(gulp.dest(paths.client));
});

通过定义excluse，您将强制它忽略这些文件，而无需编辑bower中的软件包:D

- sebastienbarbier