@diagrammo/dgmo-mcp

DGMO 다이어그램 렌더링을 위한 MCP 서버입니다. Claude Desktop, Claude Code 및 모든 MCP 호환 AI 도구와 함께 작동합니다.

도구

preview_diagram

하나 이상의 DGMO 다이어그램을 SVG로 렌더링하고 기본 브라우저에서 독립형 HTML 페이지를 엽니다. 이 페이지에는 라이트/다크 테마 토글과 반응형 SVG 레이아웃이 포함되어 있습니다.

단일 다이어그램은 간단한 미리보기 페이지로 렌더링됩니다. 여러 다이어그램은 (3개 이상의 섹션이 있을 경우) 목차가 포함된 보고서 스타일 레이아웃을 생성합니다. 일부 다이어그램 렌더링에 실패하면 성공한 다이어그램이 표시되고 실패한 다이어그램은 오류 자리 표시자가 표시됩니다.

generate_report

세련된 다중 섹션 HTML 보고서를 생성하고 선택적으로 브라우저에서 엽니다. 제목, 선택적 부제목, 자동 생성된 목차, 섹션별 설명 및 타임스탬프 바닥글이 포함됩니다. 프로젝트 분석을 공유 가능한 문서로 묶는 데 적합합니다.

Related MCP server: drawio

설정

Claude Code

프로젝트의 .claude/settings.local.json에 추가하세요:

{
  "mcpServers": {
    "dgmo": {
      "command": "npx",
      "args": ["-y", "@diagrammo/dgmo-mcp"]
    }
  }
}

Claude Desktop

~/Library/Application Support/Claude/claude_desktop_config.json에 추가하세요:

{
  "mcpServers": {
    "dgmo": {
      "command": "npx",
      "args": ["-y", "@diagrammo/dgmo-mcp"]
    }
  }
}

저장 후 Claude Desktop을 다시 시작하세요. 도구가 자동으로 나타납니다.

개발

pnpm install
pnpm build
pnpm typecheck

../dgmo에 체크아웃된 게시되지 않은 @diagrammo/dgmo를 대상으로 반복하려면, 설치 후 npm이 해결한 종속성을 작업 공간 심볼릭 링크로 재정의하세요:

pnpm install
pnpm link ../dgmo   # symlink node_modules/@diagrammo/dgmo → ../dgmo
pnpm --filter @diagrammo/dgmo build   # ensure dist/ is up to date

pnpm install은 링크를 취소하므로 종속성이 변경되면 pnpm link ../dgmo를 다시 실행하세요.

릴리스

릴리스는 .github/workflows/release.yml을 통해 태그 기반으로 수행됩니다:

1. 세 파일 모두에서 버전을 업데이트하세요 (정확히 일치해야 하며 워크플로가 검증합니다):

   • package.json → version

   • manifest.json → version

   • server.json → version 및 packages[0].version

2. 커밋 및 태그 지정:

   git commit -am "Release vX.Y.Z"
   git tag vX.Y.Z
   git push && git push --tags

3. 워크플로는 타입 체크 + 빌드를 실행하고, 출처와 함께 npm에 게시하며, .mcpb를 번들링하고, GitHub OIDC를 통해 MCP 레지스트리에 게시하며, GitHub 릴리스에 .mcpb를 첨부합니다.

필수 보안 비밀

• NPM_TOKEN — @diagrammo/* 쓰기 권한이 있는 npm 세분화된 액세스 토큰. 설정 → 보안 비밀 및 변수 → 작업 → 새 리포지토리 보안 비밀.

MCP 레지스트리 인증은 리포지토리가 diagrammo 조직에 있고 서버 네임스페이스가 io.github.diagrammo/*이므로 GitHub OIDC를 자동으로 사용합니다 (토큰 필요 없음).