Parcel设置NODE_ENV后对应环境变量文件无法加载问题

• 优先确认使用Parcel 2.x版本，Parcel 1对.env.development、.env.production这类分环境配置文件的支持存在已知缺陷，建议升级到最新稳定版Parcel 2
• 检查package.json的脚本配置，需将NODE_ENV配置在parcel命令之前，Windows环境需提前安装cross-env包抹平系统环境变量设置差异，正确配置示例如下：

{
  "scripts": {
    "dev": "cross-env NODE_ENV=development parcel src/index.html",
    "build": "cross-env NODE_ENV=production parcel build src/index.html"
  }
}

• 确认.env.development、.env.production两个文件存放在项目根目录（与package.json同级），不要放置在src等子目录下
• 检查环境变量命名规则：默认情况下，只有以PARCEL_为前缀的变量才会被Parcel注入到前端代码中，其余变量会被自动过滤避免敏感信息泄露，示例如下：

# 可正常被前端代码读取
PARCEL_APP_API_BASE = https://dev.api.com
# 会被自动过滤，前端无法读取
API_BASE = https://dev.api.com

• 若需要自定义变量前缀或允许所有变量注入，可在package.json中新增如下配置：

{
  "@parcel/transformer-js": {
    "inlineEnvironment": ["*"]
  }
}

• 每次修改.env文件或环境变量配置后，先删除项目根目录下的.parcel-cache缓存文件夹，再重新执行dev或build命令，避免旧缓存导致配置不生效

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