CODEWITHSUNDEEP
javascriptwebpack
roeygol
roeygol

Reputation: 5048

Is it possible to pack two different modules in one webpack.config?

I have a JS code which holds two modules under src folder.

We want webpack to have two JS files, one per each folder (as explained above), is it possible?

NOTE: i'm using webpack v.^3.10.0

EDIT: This is my webpack.config.js file:

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),
  ],
};

Upvotes: 2

Views: 1485

Answers (1)

sdgluck
sdgluck

Reputation: 27327

Webpack supports multiple outputs via the entry configuration field.

Just give it an object. Something like this:

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

You will also need to update output.filename to use the [name] placeholder:

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

Note that by default webpack v4 will try and pull out shared dependencies into "vendor" bundles so you may end up with more output bundles than you give it entries.

Upvotes: 2

Related Questions