javascript - 在 Gruntfile.js 中使用 grunt-browserify

Question

我在寻找有关如何使用 grunt-browserify 的解释时遇到了一些麻烦。查看他们的示例文件夹，我在他们的基本示例下的 browserify Node 下查看，我看到以下内容:

module.exports = function (grunt) {
  grunt.initConfig({
    browserify: {
      vendor: {
        src: [],
        dest: 'public/vendor.js',
        options: {
          require: ['jquery'],
          alias: [
            './lib/moments.js:momentWrapper', //can alias file names
            'events:evt' //can alias modules
          ]
        }
      },
      client: {
        src: ['client/**/*.js'],
        dest: 'public/app.js',
        options: {
          external: ['jquery', 'momentWrapper'],
        }
      }
    },
    concat: {
      'public/main.js': ['public/vendor.js', 'public/app.js']
    }
  });
  grunt.loadTasks('../../tasks');
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.registerTask('default', ['browserify', 'concat']);
};

什么是“vendor ”和“客户”，它们记录在何处？在 README 文件中，他们提到了“preBundleCB”、“dist”，我还看到了很多其他的，而且大多数都有自己的数据结构。是否在任何地方列举和解释了这些选项？

Answer 1

根据 the convention of Grunt configuration , "vendor"和 "client"是目标。它们的名称不是由 grunt 或 grunt-browserify 定义的。您可以根据需要创建任意数量的目标，并为它们命名。每个目标都有files配置，这在大多数Grunt任务中都很常见，例如src和dest，以及options 配置，这是特定于插件的。 “dist”是另一个目标示例，“preBundleCB”是 grunt-browserify 选项的一个属性。

您可以使用 grunt browserify:vendor 和 grunt browserify:client 单独调用目标。并且 grunt browserify 调用了 browserify 任务的所有目标，在这个例子中是“vendor”和“client”。

grunt-browserify 的每个目标都会创建一个捆绑的脚本文件。在此示例中，“vendor”目标创建包含 jquery 的 vendor.js、名为 momentWrapper 的 moment.js 和事件 名为evt。 “client”目标创建包含 client/**/*.js 及其依赖项的 app.js，不包括 jquery 和 momentWrapper.