Question

如果有人能告诉我处理捆绑式割草机组件的好方法，我会非常感激。我觉得我已经尝试了所有的东西......虽然，我似乎无法找到任何处理这个问题的gulp任务。真的不存在吗？

让我们说它不存在。最糟糕的情况是我必须指定每个＆＃34; dist＆＃34;的路径。来自bower_components文件夹的文件。（令人讨厌的是，每个组件似乎都有自己的＆＃34; dist＆＃34;文件夹...没有标准化。）

所以，即使我这样做，我也注意到一些组件，如“积极支持”等。似乎有require('lodash')等等。我认为，如果我只是简单地复制该文件，它将会因为要求不会解决而中断。

我错过了什么？我如何简单地将所有bower_components捆绑到一个＆＃34; common.js＆＃34; ...有没有办法或者它是一个集群虚张声势？

Answer 1

更新

正如Alerty所指出的，新的Gulp政策似乎是：直接使用bower和glob模式（并希望软件包维护者有一个合适的＆＃34;忽略＆＃34;属性）。

以前

您可以使用main-bower-files或gulp-bower-src从凉亭组件中获取文件。他们也可以使用＆＃34;忽略＆＃34;或＆＃34;主要＆＃34;在你自己的凉亭文件中覆盖。

Answer 2

这就是我管理它的方式（但是对于项目结构，请参阅gulpfile.js，它不是一个巨大的gulp文件）：

https://github.com/notbrain/viceroy/blob/master/gulp/tasks/bower.js

根据dev / prod env目标，简单地连接所有bower deps然后在dist / source位置单独执行uglify（）和minifyCSS（）任务会更加模块化，但是必须等待将来的更新

Answer 3

使用main-bower-files：

var gulp = require('gulp');
var mainBowerFiles = require('main-bower-files');

gulp.task('TASKNAME', function() {
    return gulp.src(mainBowerFiles())
        .pipe(/* what you want to do with the files */)
});

Answer 4

如果您有以下文件夹：

-app
-bower
-node_modules
Gulpfile.js
package.json

解决方案是：

gulp.task("connect", function () {
  connect.server({
    root: ["app"],
    livereload: true,
    port: 8034,
    middleware: function (connect) {
      return [connect().use("/bower", connect.static("bower"))];
    }
  });
});

Answer 5

如果您的项目使用AMD规范。

您可以使用gulp-edp捆绑模块。

在 module.conf

设置模块信息

{
    "baseUrl": "src",
    "paths": {},
    "packages": [
        {
            "name": "etpl",
            "location": "../bower_components/etpl/3.0.1/src",
            "main": "main"
        },
        {
            "name": "jquery",
            "location": "../bower_components/jquery/1.9.1/src",
            "main": "jquery.min"
        }
    ],
    "combine": {
        "app": true
    }
}

<强> gulpfile.js

var gulp = require('gulp');
var edp = require('gulp-edp');

gulp.src(
    [
        'src/**/*.js'
        'bower_components/**/*.js',
        '!bower_components/**/{demo,demo/**}',
        '!bower_components/**/{test,test/**}'
    ]
)
.pipe(edp({
    getProcessors: function () {
        var moduleProcessor = new this.ModuleCompiler();
        return [moduleProcessor];
    }
}))
.pipe(gulp.dest('dist'));

有关更多功能，请参阅EDP wiki。

吞下bower_components的Gulp任务？

5 个答案:

更新

以前