webpack 怎么根据不同的生产或开发环境来使用不同的文件

Question

webpack 怎么实现像 react native 那样的，根据不同的情况调用 index.ios.js 或 index.android.js。

我想根据 NODE_ENV 来打包 component.prod.js 或者 component.dev.js

Answer 1

直接在webpack里的alias配置即可

resolve: {
    alias: {
        "api": process.env.NODE_ENV === 'production' ? "./api.js": "./api-dev.js"
    }
}

使用时

import Api from 'api'

Answer 2

有个组件你可能用的上：react-native-config, 再搭配自定义脚本，应该能满足你的需求

Answer 3

你其实可以绑一个getEntry()的函数，

entry:{index:getEntry()} 

使用插件

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

然后再getEntry的函数中写上

if(process.env.NODE_ENV == 'prod') {
    return 'component.prod.js';
} else {
    return 'component.dev.js';    
}

差不多类似这个意思吧

Answer 4

调用不同的config配置就好

"prod": "webpack --config ./webpack/client/webpack.prod.js",
"dev": "webpack-dev-server --config ./webpack/client/webpack.dev.js --open",