javascript - 是否可以在一个 webpack.config 中打包两个不同的模块？

Question

我有一个 JS 代码，它在 src 文件夹下包含两个模块。

• awsdk:具有主要模型和服务的主要业务逻辑
• awfre:就像一个子模块，使用第一个模块和一些新的业务逻辑。

我们希望 webpack 有两个 JS 文件，每个文件夹一个(如上所述)，这可能吗？

注意:我使用的是 webpack v.^3.10.0

编辑:这是我的 webpack.config.js 文件:

const path = require('path');
const webpack = require('webpack');
const pkg = require('./package.json');
const fs = require('fs');

const banner = `${pkg.name} - ${pkg.version} - (c) 2017 - ${pkg.author} - ${pkg.homepage} \n\n ${fs.readFileSync('LICENSE').toString()}`;

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, './awsdk_module/lib/'),
    filename: 'awsdk.js',
    library: 'awsdk',
    libraryTarget: 'umd',
    umdNamedDefine: true,
  },
  devtool: 'source-map',
  module: {
    noParse: [/dtrace-provider$/, /safe-json-stringify$/, /mv/],
    rules: [
      {
        test: /\.js$/,
        include: path.join(__dirname, './src/awsdk'),
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
        },
      },
      {
        test: /\.js$/,
        include: path.join(__dirname, './specs'),
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
        },
      },
    ],
  },
  node: {
    console: false,
    fs: 'empty',
    net: 'empty',
    module: 'empty',
    tls: 'empty',
  },
  devServer: {
    contentBase: path.join(__dirname, './specs'),
    inline: true,
    port: 8081,
  },
  plugins: [
    new webpack.BannerPlugin(banner),
  ],
};

Answer 1

Webpack 通过 entry 配置字段支持多个输出。

只要给它一个对象。像这样:

{
  entry: {
    awsdk: require.resolve(__dirname, './awsdk/index.js'),
    awfre: require.resolve(__dirname, './awfre/index.js')
  }
}

您还需要更新 output.filename 以使用 [name] 占位符:

output: {
  filename: "[name].js"
}

请注意，默认情况下，webpack v4 会尝试将共享依赖项提取到“vendor”包中，因此您最终可能会得到比您提供的条目更多的输出包。