使用 main-bower-files 和 angular bootstrap ui 删除 bootstrap.js 和 jquery 依赖项答案

【问题标题】：removing bootstrap.js and jquery dependencies with main-bower-files and angular bootstrap ui使用 main-bower-files 和 angular bootstrap ui 删除 bootstrap.js 和 jquery 依赖项
【发布时间】：2015-01-05 15:10:09
【问题描述】：

Bower 和 main-bower-files 非常棒，但是，当将它们与 Angular Bootstrap UI 一起使用时，安装/包含的东西比需要的要多。

基本上：Angular Bootstrap UI，取代了 bootstrap.js 的需要和它的 jquery 依赖。但是，在安装 bootstrap 时，会安装 jquery，然后使用 main-bower-files 的 gulp 任务在我的 html 文件中包含 jquery 和 bootstrap.js。

有没有办法告诉 bower 和/或 main-bower-files 和/或 Bootstrap，不再需要 jquery 和 bootstrap.js。

到目前为止，我尝试在 bower_components/bootstrap/bower.json 中注释 jquery 依赖项和 dist/js/bootstrap.js 行，但这些文件仍然包含在内。

【问题讨论】：

标签： angular-ui-bootstrap gulp bower

【解决方案1】：

1) 切换到wiredep，我建议这样做。然后你可以这样做：

gulp.task('wiredep', function () {
  var wiredep = require('wiredep').stream;
  gulp.src('app/*.html')
    .pipe(wiredep({
      directory: 'app/bower_components',
      exclude: ['bootstrap']
    }))
    .pipe(gulp.dest('app'))
});

请注意，以上内容将删除整个引导程序，而不仅仅是其 .js 文件。 exclude 数组还可以包含正则表达式，如果您想保留示例样式，这可能是必需的。

在您的 HTML 文件中（用于 javascript）：

将您要注入样式的js 替换为css。

2) 覆盖 Bootstrap 的 bower 主文件：为 main-bower-files 提供以下选项：

{
  "overrides": {
    "bootstrap": {
      "main": [
        // files you want to include
      ]
    }
  }
}

您必须检查您不想排除的内容并将它们添加到上面的main 数组中。

另见：https://github.com/ck86/gulp-bower-files/issues/33

【讨论】：

您的第二个答案使用 main-bower-files 完成了这项工作。但是，为什么你推荐wiredep 而不是main-bower-files+gulp-inject ？
它对我有用，并且包含“排除”选项，所以它似乎更强大。