gamma-local-dev-loop

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Gamma Local Dev Loop

Gamma本地开发循环

Overview

概述

Configure an efficient local development workflow with hot reload and mock responses for Gamma presentation development.

为Gamma演示文稿开发配置一套具备热重载和模拟响应功能的高效本地开发工作流。

Prerequisites

前置条件

Completed
```
gamma-hello-world
```
setup
Node.js 18+ with nodemon or tsx
TypeScript project (recommended)

已完成
```
gamma-hello-world
```
配置
安装有Node.js 18+及nodemon或tsx
推荐使用TypeScript项目

Instructions

操作步骤

Step 1: Install Dev Dependencies

步骤1：安装开发依赖

bash

npm install -D nodemon tsx dotenv @types/node

bash

npm install -D nodemon tsx dotenv @types/node

Step 2: Configure Development Script

步骤2：配置开发脚本

Add to package.json:

json

{
  "scripts": {
    "dev": "tsx watch src/index.ts",
    "dev:mock": "GAMMA_MOCK=true tsx watch src/index.ts"
  }
}

在package.json中添加如下内容：

json

{
  "scripts": {
    "dev": "tsx watch src/index.ts",
    "dev:mock": "GAMMA_MOCK=true tsx watch src/index.ts"
  }
}

Step 3: Create Mock Client

步骤3：创建模拟客户端

typescript

// src/gamma-client.ts
import { GammaClient } from '@gamma/sdk';

const isMock = process.env.GAMMA_MOCK === 'true';

export const gamma = isMock
  ? createMockClient()
  : new GammaClient({ apiKey: process.env.GAMMA_API_KEY });

function createMockClient() {
  return {
    presentations: {
      create: async (opts) => ({
        id: 'mock-123',
        url: 'https://gamma.app/mock/preview',
        title: opts.title,
      }),
    },
  };
}

typescript

// src/gamma-client.ts
import { GammaClient } from '@gamma/sdk';

const isMock = process.env.GAMMA_MOCK === 'true';

export const gamma = isMock
  ? createMockClient()
  : new GammaClient({ apiKey: process.env.GAMMA_API_KEY });

function createMockClient() {
  return {
    presentations: {
      create: async (opts) => ({
        id: 'mock-123',
        url: 'https://gamma.app/mock/preview',
        title: opts.title,
      }),
    },
  };
}

Step 4: Set Up Environment Files

步骤4：配置环境文件

bash

undefined

bash

undefined

.env.development

GAMMA_API_KEY=your-dev-key GAMMA_MOCK=false

.env.test

GAMMA_MOCK=true

undefined

GAMMA_MOCK=true

undefined

Output

输出结果

Hot reload development server
Mock client for offline development
Environment-based configuration
Fast iteration cycle

支持热重载的开发服务器
用于离线开发的模拟客户端
基于环境的配置
快速迭代周期

Error Handling

错误处理

Error	Cause	Solution
Watch Error	File permissions	Check nodemon config
Mock Mismatch	Mock out of sync	Update mock responses
Env Not Loaded	dotenv not configured	Add `import 'dotenv/config'`

错误	原因	解决方案
监听错误	文件权限问题	检查nodemon配置
模拟不匹配	模拟数据未同步	更新模拟响应
环境变量未加载	dotenv未配置	添加 `import 'dotenv/config'`

Examples

示例

Watch Mode Development

监听模式开发

bash

npm run dev

bash

npm run dev

Changes to src/*.ts trigger automatic restart

修改src/*.ts文件会触发自动重启

undefined

undefined

Offline Development with Mocks

基于模拟的离线开发

bash

npm run dev:mock

bash

npm run dev:mock

Uses mock responses, no API calls

使用模拟响应，无需调用API

undefined

undefined

Resources

参考资源

Next Steps

下一步

Proceed to

gamma-sdk-patterns

for advanced SDK usage patterns.

继续学习

gamma-sdk-patterns

以了解高级SDK使用模式。