将 Webpack 入口点之一导出为库

Question

我有转译应用的 Webpack 配置：

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

我想让polyfill和main从浏览器的<script>标签加载，lib作为CommonJS库导出。

lib 由 Node 后端使用，但包含一些 app 模块，因此它与其他入口点一起构建）。应用程序正在被转译，因此无法在 Node 中仅从 ./app 中提取 require 模块。

这里有哪些选项？使用单独的 Webpack 配置和单独的 Webpack 运行是唯一的吗？

Answer 1

我会说最好将 lib 与 apps webpack 配置分开。由于lib 可以被两个模块（前端和后端）使用，它可以是一个可以在两端使用的库。

要使用 webpack 创建库，您可以使用下面的配置，

 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
  },

这在here详细讨论。