Question

对于我的一些捆绑文件，我想构建不同的版本（例如，一个具有管理功能，一个没有）。

似乎DefinePlugin通常用于此类事情，但也有像if-loader或ifdef-loader这样的加载器。

现在的问题是他们似乎都在所有入口点之间共享配置。我需要一种方法为不同的入口点设置不同的配置（如{with_admin_mode: true}和{with_admin_mode: false}）。

我将配置置于实际入口点JS文件的顶部，但我不知道如何在所有将被检测为true == false并删除的模块中正确创建全局变量。 / p>

Answer 1

尝试查看webpack-merge - 智能合并可以帮助您解决问题。

使用特定的入口点，插件以及您希望的内容进行动态配置有助于取决于env上的某些变量。

将配置拆分为不同文件的良好做法。您可以通过所有入口点（例如加载器）对相同的内容进行一些常见配置，然后为with_admin_mode和without_admin_node模式进行自定义配置。

Answer 2

抱歉，我的意思是编写providePlugin，而不是definePlugin。 DefinePlugin将直接替换代码中的变量，不会创建全局变量。

您可以使用providePlugin从您创建的模块文件中设置全局配置变量：

在你的webpack配置中：

plugins: [
  new webpack.ProvidePlugin({
    'config': 'config'
  })
  ...
],
resolve: {
  alias: { 'config':  path.resolve(__dirname, './config') },
  extensions: ['.js']
}

和config将设置为config.js文件导出的全局。

然后，您可以在不同的入口点访问和修改此全局。例如，您可以在entry2.js中执行config.with_admin_mode = true;，在entry2.js中执行config.with_admin_mode = false;。

另一种解决方案是直接在模块上设置窗口上的全局变量，例如： window.with_admin_mode = true;

Webpack：每个入口点的不同（Define Plugin）设置

2 个答案: