Javascript 在 webpack 中传递与环境相关的变量

发布于05月06日

我正在试着把一个棱角分明的应用程序从大口大咽变成webpack.在GULP中，我使用GULP-Preprocess替换html页面中的一些变量(例如，数据库名称)，具体取决于NODE_ENV.与webpack取得类似结果的最佳方式是什么？

定义插件

new webpack.定义插件({
    'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
}),

请注意，这将"按原样"替换匹配项.这就是字符串采用原样格式的原因.你可以有一个更复杂的 struct ，比如那里的一个物体，但是你得到了这个 idea .

new webpack.环境插件(['NODE_ENV'])

环境插件在内部使用定义插件，并将环境值映射为代码.简洁的语法.

或者，您可以通过an aliased module使用配置.从消费者的Angular 来看，它看起来是这样的:

var config = require('config');

配置本身可能如下所示:

resolve: {
    alias: {
        config: path.join(__dirname, 'config', process.env.NODE_ENV)
    }
}

假设process.env.NODE_ENV等于development.然后会映射到./config/development.js.它映射到的模块可以导出如下配置:

module.exports = {
    testing: 'something',
    ...
};

实用课程推荐