我正在我的项目中设置Redux DevTools(https://www.npmjs.com/package/redux-devtools),并希望在构建生产项目时排除DevTools.文档说这可以通过使用以下代码来完成：
if (process.env.NODE_ENV === 'production') {
module.exports = require('./configureStore.prod');
} else {
module.exports = require('./configureStore.dev');
}
我已经有一个带常量的模块,所以我已经在那里检查了NODE_ENV.
Constants.PRODUCTION = process.env.NODE_ENV === 'production'
const production = process.env.NODE_ENV === 'production'
var config = {
// configuration goes here
}
if (production) {
config.plugins = [
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false,},}),].concat(config.plugins)
}
当运行set NODE_ENV = production&& webpack时,构建得到了缩小,只使用webpack而不是缩小构建.但是,在源代码本身中,NODE_ENV未定义：
console.log(process.env.NODE_ENV) // Output: Undefined
如果我将Constants.PRODUCTION设置为true,那么DevTools不会包含在构建中.不知怎的,我应该使用DefinePlugin或ProvidePlugin(Redux DevTools文档提到它们但在不同的地方),但我无法弄清楚如何.我使用Windows 10,DevTools 3.0.0和npm脚本来运行构建过程.任何人都可以帮我解决我应该如何在我的webpack配置文件中设置DefinePlugin或ProvidePlugin？
最佳答案
我自己解决了;在webpack配置文件中我添加了这个：
原文链接：https://www.f2er.com/js/428940.htmlplugins: [
// Some other plugins
new webpack.DefinePlugin({
PRODUCTION: production,})
]
我将Constants模块中的代码更改为
Constants.PRODUCTION = PRODUCTION
这很有效.现在运行我的npm脚本时,我得到了一个没有模块的构建,因为在uglifying期间完全删除了,我可以像以前一样启动webpack dev服务器,然后加载Redux DevTools：
"scripts": {
"start": "set NODE_ENV=development&&webpack-dev-server","build": "set NODE_ENV=production&&webpack --progress --colors"
}
问题中的第一个代码片段现在看起来像这样：
if (Constants.PRODUCTION) {
module.exports = require('./configureStore.prod');
} else {
module.exports = require('./configureStore.dev');
}
