Vercel自动构建失败：无法解析'../aws-exports'模块

方案一：通过Amplify CLI在Vercel构建阶段自动生成配置文件 #

1. 配置Vercel环境变量
   进入Vercel项目的「Settings」→「Environment Variables」，添加以下两个密钥变量（设为Secret类型）：

   • AWS_ACCESS_KEY_ID：拥有Amplify只读权限的IAM用户访问密钥ID
   • AWS_SECRET_ACCESS_KEY：对应IAM用户的密钥

2. 修改构建脚本
   在项目package.json的scripts中添加prebuild命令，用于拉取Amplify配置并生成aws-exports.js：

   "scripts": {
     "prebuild": "amplify pull --appId <你的Amplify应用ID> --envName <目标环境名，如prod> --yes",
     "build": "react-scripts build"
   }
   

   替换<你的Amplify应用ID>和<目标环境名>为实际值，应用ID可在Amplify控制台的应用设置中获取。

3. 确保Vercel环境安装Amplify CLI
   在项目根目录创建vercel.json，配置构建命令前置安装CLI：

   {
     "buildCommand": "npm install -g @aws-amplify/cli && npm run build"
   }
   

   若使用yarn，替换为yarn global add @aws-amplify/cli && yarn build。

方案二：将aws-exports配置转为环境变量，动态生成配置文件 #

1. 提取配置到Vercel环境变量
   本地打开aws-exports.js，将所有配置项转为Vercel环境变量，前缀统一用REACT_APP_（React会自动注入这类变量）：

   • REACT_APP_AWS_PROJECT_REGION → 对应aws_project_region的值
   • REACT_APP_AWS_COGNITO_IDENTITY_POOL_ID → 对应aws_cognito_identity_pool_id的值
   • 按此格式添加所有需要的配置项

2. 手动创建aws-exports.ts
   在项目中新建该文件，从环境变量读取配置：

   export default {
     aws_project_region: process.env.REACT_APP_AWS_PROJECT_REGION,
     aws_cognito_identity_pool_id: process.env.REACT_APP_AWS_COGNITO_IDENTITY_POOL_ID,
     // 补充所有需要的Amplify配置项
   };
   

   替换项目中所有导入../aws-exports的路径为这个新文件。

注意事项 #

• 方案一中的IAM用户需配置最小权限，仅授予Amplify资源的读取权限，降低密钥泄露风险
• 方案二中需确保所有Amplify功能依赖的配置项都已覆盖，否则会导致功能异常
• 本地可先执行npm run prebuild或amplify pull验证配置生成是否正常，再推送代码触发Vercel构建

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