webpack配置文件导出类型

webpack配置文件导出类型有多种，一般我们写webpack用module.exports = {……}来导出一个对象

webpack配置文件导出类型

• 导出为一个对象（Object）
• Exporting a Function 导出为一个函数（Function）
• Exporting a Promise 导出为一个Promise对象
• Exporting multiple configura Exporting multiple configurations 导出多个配置

导出为一个对象（Object）

const path = require('path')
module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  }
}

导出为一个函数

module.exports = function(env, argv) {
   return {
     mode: env.production ? 'production' : 'development',
     devtool: env.production ? 'source-maps' : 'eval',
     plugins: [
       new TerserPlugin({
         terserOptions: {
           compress: argv['optimize-minimize'] // only if -p or --optimize-minimize were passed
         }
       })
     ]
};

导出为一个Promise对象

module.exports = () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({
        entry: './app.js',
        /* ... */
      });
    }, 5000);
  });
};

导出多个配置

module.exports = [{
  output: {
    filename: './dist-amd.js',
    libraryTarget: 'amd'
  },
  name: 'amd',
  entry: './app.js',
  mode: 'production',
}, {
  output: {
    filename: './dist-commonjs.js',
    libraryTarget: 'commonjs'
  },
  name: 'commonjs',
  entry: './app.js',
  mode: 'production',
}];

参考

webpack官网 - Configuration Types
【webpack4】不同的导出类型