Webpack配置中如何复用config-overrides.js里externals的已定义键？

当然可以复用已定义的配置值！你当前的写法会报错，因为API_BASE是Config对象内部的属性，在对象字面量初始化时无法直接引用同一个对象里的其他属性。我们只需要把要复用的值先提取成独立变量，就能轻松实现复用了。

修改后的代码如下：

const webpack = require('webpack');

module.exports = function override(config, env) {
  // 先把API_BASE定义为独立变量
  const apiBase = 'http://192.168.0.1';
  
  config.externals = {
    'Config': {
      API_BASE : apiBase,
      LOGIN : `${apiBase}/login`, // 直接复用变量
    }
  }
  
  return config;
}

为什么这样可行？ #

• 把API_BASE的字符串值存到外部变量apiBase后，它就可以在对象字面量的多个属性中被引用
• 使用模板字符串（`${apiBase}/login`）让拼接URL的代码更清晰易读，你也可以用普通字符串拼接：apiBase + '/login'

如果之后需要修改API地址，只需要更新apiBase这一处即可，所有依赖它的配置都会自动同步，避免了重复修改的麻烦。

内容的提问来源于stack exchange，提问作者Joms