webpack配置的类型

本文作者: jsweibo

本文链接: https://jsweibo.github.io/2019/05/31/webpack%E9%85%8D%E7%BD%AE%E7%9A%84%E7%B1%BB%E5%9E%8B/

摘要

本文主要讲述了：

function
Promise
Array

正文

webpack 配置不仅可以写成Object的形式，还能写成其他类型。

function

示例：

module.exports = function (env, argv) {
  // env是argv对象的子属性
  return {
    mode: env.prod ? 'production' : 'development',
  };
};

1
2
3

#!/usr/bin/env bash

npx webpack --env.prod

相当于：

1
2
3

module.exports = {
  mode: 'production',
};

Promise

示例：

module.exports = (env, argv) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({
        mode: 'development',
      });
    }, 5000);
  });
};

Array

常用于针对不同的目标环境各自打包（例如：CommonJS 和 AMD）

示例：

module.exports = [
  {
    mode: 'development',
    output: {
      filename: 'development.js',
    },
  },
  {
    mode: 'production',
    output: {
      filename: 'production.js',
    },
  },
];