aws amplify - process.env.API_KEY 未定义

Question

我添加以放大构建设置：

我还在代码中添加到 amplify.yml

version: 0.1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run export
        **- REACT_APP_ENV_API=${REACT_APP_ENV_API}**
  artifacts:
    baseDirectory: .next
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

我在这里将我的反应环境变量添加到放大环境变量中：

当我尝试使用 process.env.REACT_APP_ENV_API 时，我仍然不确定。

Answer 1

你缺少export ：

- export REACT_APP_ENV_API=${REACT_APP_ENV_API}

此外，根据 Julio 的评论，如果您使用的是 Next.js，请确保您按照文档向浏览器公开环境变量： https://nextjs.org/docs/basic-features/environment-variables#exposing -环境变量到浏览器

Answer 2

我首先通过 App Settings > Environment Variables 将环境变量添加到 AWS Amplify 控制台来让它工作。

然后我转到 App Settings > Build Settings 并修改amplify.yml配置文件以包含变量定义。

例如：

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - yarn install
    build:
      commands:
        - echo "GITHUB_CLIENT_ID=$GITHUB_CLIENT_ID" >> .env
        - echo "GITHUB_CLIENT_SECRET=$GITHUB_CLIENT_SECRET" >> .env
        - echo "NEXTAUTH_URL=$NEXTAUTH_URL" >> .env
        - echo "NEXTAUTH_SECRET=$NEXTAUTH_SECRET" >> .env
        - yarn run build
  artifacts:
    baseDirectory: .next
    files:
      - "**/*"
  cache:
    paths:
      - node_modules/**/*