Gitpod：为开发者即开即用的云 IDE

gitpod.io/#https://github.com/你的用户名/你的项目

首次需要授权 Gitpod 访问你的代码托管平台账户。登录后，工作区会自动开始构建。

如果觉得输入前缀麻烦，可以安装 [Gitpod 浏览器扩展](https://www.gitpod.io/docs/configure/user-settings/browser-extension)，这样在 GitHub 仓库页面会出现绿色的 “Gitpod” 按钮。

### 熟悉工作区界面

工作区启动后，你会看到一个很像 VS Code 的界面：

- **左侧活动栏**：资源管理器、搜索、源代码管理等常规图标。
- **编辑区域**：分栏显示代码文件。
- **底部终端**：一个全功能的 Linux 终端，已经位于你的仓库根目录下。
- **端口转发**：如果你启动了 web 服务，Gitpod 会自动检测端口并提供公开可访问的 URL。

你可以直接在终端中运行任何命令，比如 `npm install`、`pip install -r requirements.txt`，就如同在本地一样。

### 停止与休眠

关闭浏览器标签页后，工作区会进入**休眠**状态，并在短时间（标准版 30 分钟）后自动停止。你也可以在 Gitpod 仪表板中手动停止或删除工作区。未停止的工作区会耗尽每月的免费额度，因此完成工作后最好主动停止。

## 用 `.gitpod.yml` 定制你的工作区

Gitpod 的真正强大之处在于**配置即代码**。将 `.gitpod.yml` 放在仓库根目录，Gitpod 在创建工作区时会自动读取并执行。

### 基本结构

```yaml
image: gitpod/workspace-full   # 使用的 Docker 镜像

tasks:
  - name: 安装依赖
    init: npm install           # 仅在工作区首次创建时执行
    command: npm run dev        # 每次工作区启动时执行

ports:
  - port: 3000
    onOpen: open-preview       # 服务启动后自动打开浏览器预览

vscode:
  extensions:
    - dbaeumer.vscode-eslint   # 自动安装的 VS Code 扩展

常见配置场景

前端项目（React / Vue）

tasks:
  - init: npm install
    command: npm start
ports:
  - port: 3000
    onOpen: open-preview

Python + Flask

image: gitpod/workspace-python
tasks:
  - init: pip install -r requirements.txt
    command: python app.py
ports:
  - port: 5000
    onOpen: open-preview

多任务环境

你可以定义多个任务，同时启动数据库、后端 API 和前端：

tasks:
  - name: 数据库
    command: mongod
  - name: 后端
    command: cd server && npm run dev
  - name: 前端
    command: cd client && npm start