如果与 DefinePlugin 一起使用,将应用程序部署到 Heroku 不起作用

Deploying app to Heroku doesnt work if used together with DefinePlugin

到目前为止,我一直在像这样 webpack -p 构建我的 webpack 包并部署到 Heroku。一切都很好。我想有更多的控制权,所以我没有使用 -p,而是在我的 webpack 配置中使用了 UglifyJsPlugin 和 DefinePlugin,因为这正是 -p 所做的。 这是问题开始的地方。

如果我在没有 DefinePlugin 的情况下使用 -p,这就是我的构建文件最后的样子。

var PORT = process.env.NGINX_PORT ? '/tmp/nginx.socket' : process.env.PORT;

process.env.PORT 保持正常,正在部署到 Heroku。

如果我使用 DefinePlugin

var PORT = Object({"NODE_ENV":"production"}).NGINX_PORT ? '/tmp/nginx.socket' : Object({"NODE_ENV":"production"}).PORT;

我的 process.env.PORT 不在了,部署到 Heroku 失败了。

如何在使用 DefinePlugin 的同时保持 process.env.PORT 完整?

这是我的 webpack 配置

new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify(process.env.NODE_ENV),
      },
    }),

和我的启动脚本

"start": "cross-env NODE_ENV=production node ./src/build/bundle.js"

如果您想 process.env.PORT 从 env 获取,只需更改您使用插件的方式。

new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
})

DefinePlugin 将翻译您放入构造函数中的所有内容。这发生在你身上,因为你在顶层只有 process.env。您必须具体说明要翻译的内容。