如何在package.json中使用.env文件中的环境变量？

JSON是静态格式，不支持直接嵌入process.env.PROXY这类JavaScript表达式，所以你之前的写法无法生效，下面是几种可行的解决方式：

方法一：用Node.js脚本动态修改package.json #

写一个简单脚本读取.env变量并更新package.json：

1. 创建setup-proxy.js文件：

const fs = require('fs');
const dotenv = require('dotenv');

// 加载.env文件中的变量
dotenv.config();

// 读取并解析package.json
const pkgContent = fs.readFileSync('./package.json', 'utf8');
const pkg = JSON.parse(pkgContent);

// 替换proxy字段为环境变量值
pkg.proxy = process.env.PROXY;

// 将修改后的内容写回package.json
fs.writeFileSync('./package.json', JSON.stringify(pkg, null, 2));

2. 在package.json的scripts中添加执行命令：

{
  "scripts": {
    "setup:proxy": "node setup-proxy.js",
    "start": "npm run setup:proxy && react-scripts start" // 整合到项目启动命令中
  }
}

3. 执行npm run setup:proxy即可完成proxy字段更新，或直接启动项目时自动执行。

方法二：在项目配置代码中读取环境变量（推荐） #

如果是React、Vue这类框架项目，无需在package.json中配置proxy，直接在专属代理配置文件里读取环境变量：
以React项目为例，创建src/setupProxy.js：

const { createProxyMiddleware } = require('http-proxy-middleware');
const dotenv = require('dotenv');

dotenv.config();

module.exports = function(app) {
  app.use(
    '/api', // 配置需要代理的接口路径前缀
    createProxyMiddleware({
      target: process.env.PROXY,
      changeOrigin: true,
    })
  );
};

这种方式更灵活，无需修改静态的package.json文件。

方法三：用环境变量替换工具批量处理 #

先在package.json中写占位符，再用工具替换为实际环境变量：

1. 暂存package.json模板（比如命名为package.json.tpl）：

{
  "name": "name",
  "version": "1.0.0",
  "proxy": "${PROXY}",
  "private": true
}

2. 使用envsubst（Linux/macOS系统自带）命令替换：

envsubst < package.json.tpl > package.json

或用Node.js的replace-in-file包写脚本实现跨平台替换。

注意事项 #

• 使用Node.js相关脚本时，需先安装dotenv依赖：npm install dotenv --save-dev
• 不同框架的代理配置方式略有差异，可对应框架文档调整配置逻辑。

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