AgentSkillsCN

configurable-api-base-url

在前端（例如 Vite）中配置可变的 API 基础 URL：只需设置一个环境变量（如 VITE_API_URL），由共享的 API 客户端读取该变量，所有调用站点均使用此客户端。切勿在多个文件中硬编码主机或端口；也无需创建或提交 .env 文件——只需保留 .env.example 及相关文档。当您需要新增或更改前端 API 调用时，可使用此技能。

SKILL.md
--- frontmatter
name: configurable-api-base-url
description: Configurable API base URL in frontend (e.g. Vite): single env variable (e.g. VITE_API_URL), shared API client that reads it, and all call sites use that client. Do not hardcode host/port in multiple files; do not create or commit .env—only .env.example and documentation. Use when adding or changing frontend API calls.

Configurable API Base URL (Frontend)

Use a single source of truth for the API base URL in the frontend so port/host changes don't require editing many files.

Steps

  1. •Add VITE_API_URL (or equivalent) to .env.example with a placeholder (e.g. http://localhost:3000).
  2. •Create a shared client (e.g. src/utils/api.ts or api.ts) that uses import.meta.env.VITE_API_URL for the base URL.
  3. •Replace direct fetch/axios calls with this client so all requests go through one place.
  4. •Do not create or modify .env in the repo. Document that users should copy .env.example to .env for local use.

Do Not

  • •Hardcode the host/port in multiple files.
  • •Create or commit .env (only .env.example and docs).

Integration

  • •Works with environment-files skill (no .env in repo, only .env.example).