将环境变量从 gulp 注入到 webpack

Posted 2023-03-08

【中文标题】将环境变量从 gulp 注入到 webpack

【英文标题】：Injecting an environment variable from gulp to webpack

【发布时间】：2016-01-19 23:20:09

【问题描述】：

我有一个用于启动 webpack 捆绑的 gulpfile。 webpack 配置定义了一个使用process.env.NODE_ENV 的别名，如下所示

.
.
resolve: 
    modulesDirectories: ["node_modules", "js", "jsx"],
    extensions: ["", ".js", ".jsx"],
    alias: 
        config: path.join(__dirname, ('config.' + process.env.NODE_ENV + '.js'))
    
..

在 gulpfile 中，我有 2 个任务按顺序执行

set-env 使用gulp-env 设置环境变量如下

gulpEnv(
    vars: 
        NODE_ENV: 'dev'
    
);

webpack 依赖于前一个任务并且仅在第一个任务完成时执行的任务

这里的变量似乎没有被正确注入。文件名被解析为config.undefined.js。我在做什么有问题吗？

【问题讨论】：

您找到解决方案了吗？我也有同样的问题。

【参考方案1】：

我把我的方法改成这样了

Webpack

var NODE_ENV = process.env.NODE_ENV;

var config = 
    .
    .
    resolve: 
        modulesDirectories: ["node_modules", "js", "jsx"],
        extensions: ["", ".js", ".jsx"],
        alias: 
            //<envt> will be injected by gulp
            config: config: path.join(__dirname, ('config.<envt>.js'))
        
    
    .
    .
    .


//If webpack is directly invoked with NODE_ENV, replacement will happen here
if (NODE_ENV) 
    config['resolve']['alias']['config'] = config['resolve']['alias']['config'].replace(/<envt>/, NODE_ENV);


module.exports = config;

吞咽

在set-env内部，我没有使用gulp-env进行设置，而是简单地设置了一个全局变量NODE_ENV='dev' 在webpack任务里面，我在做webpackConfig['resolve']['alias']['config'] = webpackConfig['resolve']['alias']['config'].replace(/<envt>/, NODE_ENV);

这对我有用