13

I have Webpack configuration for transpiled app:

entry: {
    'polyfill': './app/polyfill.js',
    'lib': './app/lib.js',
    'main': './app/main.js'
},
output: {
    path: './bundles',
    filename: '[name].js',
    sourceMapFilename: '[name].map'
},
...

I would like to have polyfill and main to be loaded from <script> tag in browser, and lib to be exported as CommonJS library.

lib is used by Node backend but contains some of app modules, so it is built alongside with other entry points). The application is being transpiled, so it is not possible to just require modules from ./app in Node.

What are the options here? Is using separate Webpack configs and separate Webpack runs the only one?

Estus Flask
  • 206,104
  • 70
  • 425
  • 565

1 Answers1

3

I would say it is better to separate the lib from apps webpack config. Since the lib could be used by both of the modules (front-end, and backend), it could be a library which can be used at both ends.

To create a library with webpack, you can use with the config below,

 entry: { lib: './app/lib' },
 output: {
    path: __dirname + '/lib', // path to output
    filename: outputFile, // library file name
    library: libraryName, // library name
    libraryTarget: 'umd', // the umd format
    umdNamedDefine: true // setting this to true will name the AMD module
  },

This is discussed here in detail.

Community
  • 1
  • 1
Thaadikkaaran
  • 5,088
  • 7
  • 37
  • 59
  • I was hoping I could make it in a single Webpack pass. Too bad that there's no obvious way to do that. – Estus Flask Feb 04 '17 at 22:04
  • Since you want to use the `lib` entry as a library, it has to be in the separate webpack config, so that you can get an `output` of library. – Thaadikkaaran Feb 06 '17 at 06:46