如何在生产与开发中连接不同的依赖关系

时间:2015-08-10 21:21:39

标签: angularjs bower wiredep

是否有最佳实践来配置Bower.json,以便开发文件和生产文件设置在不同的区域,并与WireDep等工具很好地配合使用?

我正在将这个Angular插件用于Google地方Kuhnza/Angular-Google-Places-Autocomplete

此项目的Bower.json包含主数据结构中列出的原始文件和缩小文件。

Bower.json

{
  "name": "angular-google-places-autocomplete",
  "version": "0.2.7",
  "main": [
      "./src/autocomplete.js",
      "./src/autocomplete.css",
      "./dist/autocomplete.min.js",
      "./dist/autocomplete.min.css"
  ],
  "dependencies": {
    "angular": "^1.2.x"
  },
  "devDependencies": {
    "angular-mocks": "^1.2.x"
  },
  "ignore": []
}

当我运行我的wiredep任务时,它包括我的Index.html中的缩小文件和原始文件

/ ------------------------------------------------------------------------------------------
// Wire Dependenciews from root bower.json in the index.html, e.g. Inject bower components
// ------------------------------------------------------------------------------------------
gulp.task('wiredep', function () {
    var wiredep = require('wiredep').stream;

    gulp.src('app/styles/*.scss')
      .pipe(wiredep({
          ignorePath: /^(\.\.\/)+/
      }))
      .pipe(gulp.dest('app/styles'));

    gulp.src('app/*.html')
      .pipe(wiredep({
          exclude: ['bootstrap-sass-official'],
          ignorePath: /^(\.\.\/)*\.\./
      }))
      .pipe(gulp.dest('app'));
});

生成输出

<script src="/bower_components/angular-google-places-autocomplete/src/autocomplete.js"></script>
<script src="/bower_components/angular-google-places-autocomplete/dist/autocomplete.min.js"></script>

0 个答案:

没有答案