在多个项目中使用 gulp 任务

Question

我有一个生成网站图标的 gulp 任务。我想在多个项目中重复使用此任务。它基于 realfavicongenerator.net 输出的 gulp 文件。

我该如何解决这个问题？ favicon 生成器任务是一个 git 存储库，它可以作为我其他项目 git 存储库中的子模块引用吗？或者我应该将其生成为 npm 或 bower 包。

我希望能够将一些选项传递给生成器任务以覆盖默认设置。

我不确定从哪里开始，任何正确方向的帮助将不胜感激。

谢谢

Answer 1

我制作了可重复使用的 gulp 任务，因为我们有多个前端项目都使用 gulp。我发现的最好方法是创建一个私有 npm 包，我将其添加到其他项目中，其中包含 git URL.

构建一个 Node.js 可共享任务模块

您只需要一个带有 index.js 和 package.json 的存储库。安装必要的 gulp 依赖项并将它们保存在包文件中。

在 index.js 中，将您要重用的函数导出为任务。

const gulp = require('gulp'),
    gulpif = require('gulp-if'),
    concat = require('gulp-concat'),
    args = require('yargs').argv;

module.exports = {
    concat: function(src, dest, options) {
        return gulp.src(src)
            .pipe(gulpif(args.prod, concat()))
            .pipe(gulp.dest(dest));
    }
};

由于此模块将使用执行任务所需的大部分依赖项，因此您的其他项目依赖项将减少到它们明确需要的最小值。

使用你的任务模块

然后，在您的其他项目中，安装带有 git URL 的包。

npm install --save-dev git+ssh://git@github.com:onebitrocket/onebitrocket-gulp-utils.git

这种 git url 格式也适用于 yarn.

并且在您的项目 gulpfile.js 中使用它。

const gulp = require('gulp'),
      onebitrocket = require('onebitrocket-gulp-utils');

// use a function which returns the result of your util.
gulp.task('js', () => onebitrocket.concat('src/**/*.js', 'www/'));

注意：不需要将包发布到 npm 注册表即可使用它。您所需要的只是对存储库的读取访问权限。

在多个项目中使用 gulp 任务

Use a gulp task in mulitple projects

git

git-submodules

npm

bower

gulp

构建一个 Node.js 可共享任务模块

使用你的任务模块