mcpField
E
environment-variables

environment-variables

github.com/elie222开发12.8k39 次安装今天更新
代码仓库

关于 environment-variables

用于说明如何在项目中添加环境变量的开发技能,涵盖示例值、服务端与客户端的 Schema,以及构建配置。

主要功能

  1. 01在 .env.example 中添加变量
  2. 02在 env.ts 中定义服务端和客户端 Schema
  3. 03配置客户端运行时环境值
  4. 04在 turbo.json 中登记构建环境依赖

适用场景

  1. 01添加服务端 API 密钥
  2. 02添加客户端功能标志

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/elie222/inbox-zero --skill environment-variables

安装后在 Claude Code 中输入/environment-variables确认已加载。

详细介绍

环境变量

以下是向项目中添加环境变量的方法:

  1. 添加到 .env.example:

    NEW_VARIABLE=value_example
    
  2. 添加到 apps/web/env.ts:

    // 仅供服务端使用的变量
    server: {
      NEW_VARIABLE: z.string(),
    }
    // 客户端使用的变量
    client: {
      NEXT_PUBLIC_NEW_VARIABLE: z.string(),
    }
    experimental__runtimeEnv: {
      NEXT_PUBLIC_NEW_VARIABLE: process.env.NEXT_PUBLIC_NEW_VARIABLE,
    }
    
  3. 对于客户端使用的变量:

    • 必须以 NEXT_PUBLIC_ 为前缀
    • 添加到 client 和 experimental__runtimeEnv 部分
  4. 在 turbo.json 的 globalDependencies 下添加:

    {
      "tasks": {
        "build": {
          "env": [
            "NEW_VARIABLE"
          ]
        }
      }
    }
    

示例:

  • 输入:|

    添加服务端 API 密钥

    .env.example

    API_KEY=your_api_key_here

    env.ts

    server: { API_KEY: z.string(), }

    turbo.json

    "build": { "env": ["API_KEY"] } 输出:"已正确添加服务端环境变量"

  • 输入:|

    添加客户端功能标志

    .env.example

    NEXT_PUBLIC_FEATURE_ENABLED=false

    env.ts

    client: { NEXT_PUBLIC_FEATURE_ENABLED: z.coerce.boolean().default(false), }, experimental__runtimeEnv: { NEXT_PUBLIC_FEATURE_ENABLED: process.env.NEXT_PUBLIC_FEATURE_ENABLED, }

    turbo.json

    "build": { "env": ["NEXT_PUBLIC_FEATURE_ENABLED"] } 输出:"已正确添加客户端环境变量"

参考:

  • apps/web/env.ts
  • apps/web/.env.example
  • turbo.json

评论

支持 Markdown