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

到目前为止，我一直在像这样构建我的webpack包包

webpack-p

，并部署到Heroku。一切都很顺利。我希望有更多的控制，所以我没有使用

-p

，而是在我的网页配置中使用了UglifyJsPlugin和DefinePlugin，因为这正是-p所做的。 这就是问题的根源

如果我使用

-p

而不使用DefinePlugin，那么构建文件的结尾就是这样的

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不变

这是我的网页配置

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。您必须特定于您希望它转换的内容。

否。定义插件将把您放入其中的所有内容转换为对象（{“NODE_ENV”：“production”}）