如何将参数从 Web-pack 传递到代码？

Posted 2023-03-13

【中文标题】如何将参数从 Web-pack 传递到代码？

【英文标题】：How to pass Parameters from Web-pack to Code?

【发布时间】：2018-12-23 15:52:50

【问题描述】：

我有一个使用 yargs 接收参数 location 的 gulp 任务。我使用 webpack 为我的应用程序提供入口点

 webpackConfig.entry.push('BootStrapper.ts');

我有一个 webpack 配置，它具有引导程序的入口点。

module.exports = 
entry: [],
output: 
    path: require("path").resolve('./dist/'),
    filename: 'MyProcess.built.js'
 ,

我想将 location 变量传递给 Bootstrapper.ts 有没有办法实现它？

【参考方案1】：

是的，有。

首先，调整你的 webpack 配置 以接收参数：

  plugins: [
    new webpack.DefinePlugin(
      'process.env.YOUR_UNIQUE_VARIABLE': JSON.stringify(process.env.YOUR_UNIQUE_VARIABLE)
    )
  ]

然后，在您的 Bootstrapper.ts 中，您可以编写如下内容：

const buildVariable = process.env.YOUR_UNIQUE_VARIABLE;

如果你现在运行你的 webpack 脚本（我假设运行一个 npm 脚本）传递如下变量：

cross-env YOUR_UNIQUE_VARIABLE=value webpack

您的代码将被编译为：

const buildVariable = 'value';