콘텐츠로 이동
drawtonomy drawtonomy

Extension SDK

drawtonomy 확장은 postMessage로 에디터와 통신하는 iframe 호스팅 웹 앱입니다. SDK가 타입이 있는 클라이언트를 제공하고, dev-server가 개발할 수 있는 로컬 에디터를 제공합니다.

이 페이지는 빠른 안내서입니다. 매니페스트 스키마, capability 목록, 메시지 프로토콜을 포함한 전체 가이드는 공개 저장소에 있습니다.

➡ Extension Development Guide (日本語)

빠른 시작

섹션 제목: “빠른 시작”
Terminal window
# 에디터 :3000
pnpm add -g @drawtonomy/dev-server
drawtonomy-dev-server


# 확장 :3001
cd my-extension && pnpm dev --port 3001


open "http://localhost:3000/?ext=http://localhost:3001/manifest.json"

최소 확장

섹션 제목: “최소 확장”
my-extension/
  manifest.json
  index.html
  src/
manifest.json
{
  "id": "my-extension",
  "name": "My Extension",
  "version": "1.0.0",
  "entry": "./index.html",
  "capabilities": ["shapes:read", "shapes:write", "ui:panel"]
}
src/main.ts
import { ExtensionClient, createVehicle } from '@drawtonomy/sdk'


const client = new ExtensionClient()
await client.ready()


document.getElementById('add')!.addEventListener('click', async () => {
  await client.addShapes([createVehicle(0, 0, { templateId: 'sedan' })])
})

참고용 확장

섹션 제목: “참고용 확장”

트리에 포함된 확장들은 완전한 예제입니다.

함께 보기

섹션 제목: “함께 보기”