Mobiscroll MCP

npx add-mcp 'https://mcp.mobiscroll.com'

Mobiscroll은 MCP 서버와 에이전트 스킬을 제공하여 코딩 어시스턴트가 스케줄러, 이벤트 캘린더, 타임라인 및 피커 코드를 올바르게 생성하도록 지원합니다. Claude Code, Codex, Cursor 및 GitHub Copilot에서 사용할 수 있으며, 기계가 읽을 수 있는 문서와 AI 동작 규칙도 함께 제공됩니다.

AI 통합이 필요한 이유는?

AI 코딩 어시스턴트는 구조화되고 권위 있는 문서에 접근할 수 있을 때 가장 잘 작동합니다. 문서가 없으면 다음과 같은 문제가 자주 발생합니다:

• API를 환각 — 존재하지 않는 옵션 이름, 이벤트 또는 유형을 만들어냅니다
• 프레임워크 혼용 — React 훅과 JSX 대신 Angular 모듈 가져오기 또는 jQuery 플러그인 구문을 사용합니다
• 오래된 버전 참조 — 현재 버전이 v6인데 v5 코드를 생성합니다
• 프레임워크 규칙 무시 — @mobiscroll/react에서 명명된 가져오기를 건너뛰거나 CSS 가져오기를 생략합니다

Mobiscroll AI 통합은 AI 소비에 최적화된 문서와 프레임워크 격리 및 올바른 API 사용을 강제하는 동작 규칙을 제공하여 이러한 문제를 해결합니다.

아키텍처 개요

통합은 세 가지 계층으로 구성됩니다:

데이터 계층 — llms 파일

프레임워크별로 완전한 Mobiscroll API 참조 및 가이드를 포함하는 기계가 읽을 수 있는 문서 파일입니다. AI 도구가 질문에 답하기 위해 읽는 정보의 원천입니다.

파일	설명
llms-react-full.txt	완전한 React 문서
llms-react.txt	React 목차 (개별 페이지 링크)
llms-icons.txt	아이콘 이름 (IcoMoon, Font Awesome, Ionicons) — 모든 프레임워크

[!-info] -info info

이 파일을 다운로드하거나 호스팅할 필요는 없습니다. 규칙 파일과 Claude Code 및 Codex 플러그인이 이 파일을 직접 참조하고 콘텐츠를 자동으로 가져옵니다.

규칙 계층 — 규칙 파일

규칙 파일은 Cursor 및 GitHub Copilot에만 Mobiscroll 컨텍스트를 제공합니다. Claude Code와 Codex는 Mobiscroll 플러그인을 대신 사용하므로 수동 파일 설정이 필요 없습니다.

두 가지 접근 방식이 제공됩니다:

• 옵션 A — 파일 기반 컨텍스트 로딩. 규칙 파일(.mdc for Cursor, .instructions.md for Copilot)에 API 문서와 동작 규칙이 포함되어 있습니다. MCP 서버가 필요 없습니다.
• 옵션 B — MCP 서버를 통한 실시간 스키마 가져오기. 확장된 규칙 파일은 AI가 생성할 때마다 Mobiscroll MCP 서버를 호출하여 실시간 컴포넌트 스키마를 조회하도록 지시합니다. 쿼리별 정밀도가 필요한 대화형 코딩 에이전트에 적합합니다.

선호도와 설정에 따라 선택하세요.

파일

옵션 A — 파일 기반 규칙:

파일	형식	대상
mobiscroll-react.mdc	Cursor 규칙 파일	Cursor
copilot-instructions/mobiscroll-react.instructions.md	Copilot 지시 파일	GitHub Copilot

옵션 B — MCP가 포함된 확장 규칙:

파일	형식	대상
mobiscroll-ui.mdc	Cursor 확장 규칙 (오케스트레이터)	Cursor
mobiscroll-ui-react.mdc	Cursor 확장 규칙 (React)	Cursor
mobiscroll-ui-theming.mdc	Cursor 확장 규칙 (테마)	Cursor
mobiscroll-ui.instructions.md	Copilot 확장 지시 (오케스트레이터)	GitHub Copilot
mobiscroll-ui-react.instructions.md	Copilot 확장 지시 (React)	GitHub Copilot
mobiscroll-ui-theming.instructions.md	Copilot 확장 지시 (테마)	GitHub Copilot

어떤 도구가 어떤 파일을 사용하나요?

도구	접근 방식	사용 파일
Cursor	옵션 A	mobiscroll-react.mdc
Cursor	옵션 B	mobiscroll-ui.mdc, mobiscroll-ui-react.mdc, mobiscroll-ui-theming.mdc
GitHub Copilot	옵션 A	mobiscroll-react.instructions.md
GitHub Copilot	옵션 B	mobiscroll-ui.instructions.md, mobiscroll-ui-react.instructions.md, mobiscroll-ui-theming.instructions.md

실시간 스키마 계층 — MCP 서버

Mobiscroll MCP 서버는 Model Context Protocol을 통해 구조화되고 버전이 표시된 API 지식을 제공합니다. 이는 단일 통합 서버입니다. UI 컴포넌트 도구를 노출하는 동일한 mobiscroll 서버가 Connect 접두사가 붙은 Mobiscroll Connect 도구도 제공하므로 충돌이 발생하지 않습니다. 문서 스냅샷에 의존하는 대신, 어시스턴트는 이러한 도구를 호출하여 생성 시점에 정확한 컴포넌트 스키마, 유효한 props/이벤트 또는 작동 예제를 가져올 수 있으므로 현재 API에서 벗어나거나 환각을 일으키지 않습니다. 노출되는 전체 목록은 MCP 도구 참조를 참조하세요.

이는 https://mcp.mobiscroll.com/에 있는 호스팅된 Streamable HTTP 서버로, 로컬 설치가 필요 없습니다. Cursor 및 GitHub Copilot에서는 선택 사항이며(옵션 B를 선택한 경우에만 사용), Claude Code 및 Codex에서는 플러그인을 통해 번들로 제공되어 항상 활성화됩니다.

Cursor 설정

1단계: 문서 소스 등록

Cursor 설정 → 인덱싱 및 문서를 열고 프레임워크에 맞는 문서 소스를 추가하세요:

프레임워크	이름	URL
React	Mobiscroll React	https://mobiscroll.com/docs/llms-react-full.txt

사용 사례에 맞는 소스만 등록하세요. 여러 소스를 등록하지 마세요. 이렇게 하면 교차 도메인 오염을 방지할 수 있습니다.

2단계: 동작 규칙 추가

한 가지 접근 방식을 선택하세요. 옵션 A는 추가 설정 없이 즉시 작동합니다. 옵션 B는 더 높은 정확도를 위해 실시간 MCP 스키마 조회를 추가하지만 MCP 서버를 구성해야 합니다.

옵션 A — .mdc 규칙 파일

mobiscroll-react.mdc 파일을 다운로드하여 .cursor/rules/에 배치하세요:

your-project/
├── .cursor/
│   └── rules/
│       └── mobiscroll-react.mdc
├── src/
└── package.json

.mdc 파일은 텍스트 기반 API 규칙을 제공하며 추가 설정이 필요 없습니다.

옵션 B — 확장 규칙 파일 + MCP (3개 파일)

세 개의 확장 규칙 파일을 다운로드하여 .cursor/rules/에 배치하세요:

• mobiscroll-ui.mdc (오케스트레이터)
• mobiscroll-ui-react.mdc (React 규칙)
• mobiscroll-ui-theming.mdc (테마)

your-project/
├── .cursor/
│   └── rules/
│       ├── mobiscroll-ui.mdc
│       ├── mobiscroll-ui-react.mdc
│       └── mobiscroll-ui-theming.mdc
├── src/
└── package.json

옵션 A와 달리, 이 규칙 파일은 Cursor의 AI가 생성할 때마다 Mobiscroll MCP 서버를 호출하여 실시간 컴포넌트 스키마를 조회하도록 지시하므로 메모리에서 추측하는 대신 현재 API에서 작동합니다. 다른 AI 출력과 마찬가지로 병합하기 전에 생성된 코드를 검토하세요.

규칙 활성화

확장된 .mdc 파일은 frontmatter에 description가 포함된 alwaysApply: false을 사용합니다. Cursor는 설명을 읽고 컨텍스트가 관련된 경우에만 규칙을 활성화합니다. 규칙이 모든 메시지에 포함되지는 않습니다. @rule-name로 수동으로 트리거할 수도 있습니다 (예: @mobiscroll-ui). .mdc 형식은 Agent 모드를 포함한 모든 Cursor 모드에서 작동합니다.

3단계: MCP 서버 연결

확장 규칙이 실시간 스키마 조회를 위해 호출할 수 있도록 Mobiscroll MCP 서버를 구성하세요.

프로젝트 루트에 .cursor/mcp.json을 생성하거나 편집하세요:

{
  "mcpServers": {
    "mobiscroll": {
      "url": "https://mcp.mobiscroll.com/"
    }
  }
}

[!-warning] -warning type 필드 없음

Cursor는 URL에서 전송 유형을 추론합니다. Cursor 구성에 "type": "http"을 추가하지 마세요. 오류가 발생합니다.

your-project/
├── .cursor/
│   ├── mcp.json
│   └── rules/
│       ├── mobiscroll-ui.mdc
│       ├── mobiscroll-ui-react.mdc
│       └── mobiscroll-ui-theming.mdc
├── src/
└── package.json

범위	구성 파일	팀과 공유
프로젝트	프로젝트 루트의 .cursor/mcp.json	예, 커밋된 경우
전역	~/.cursor/mcp.json	아니요, 모든 프로젝트에 적용

연결 확인: Cursor에서 출력 패널을 열고 드롭다운에서 MCP 로그를 선택하세요. 성공적인 연결은 mobiscroll 서버에 대한 도구 검색 메시지를 기록합니다.

작동 방식

Cursor에게 Mobiscroll에 대해 질문할 때 @docs을 포함하여 등록된 문서를 읽도록 하세요:

@docs How do I set up a weekly scheduler with Mobiscroll?

@docs What options does the Eventcalendar timeline view accept?

GitHub Copilot 설정

1단계: 동작 규칙 추가

한 가지 접근 방식을 선택하세요. 옵션 A는 추가 설정 없이 즉시 작동합니다. 옵션 B는 더 높은 정확도를 위해 실시간 MCP 스키마 조회를 추가하지만 MCP 서버를 구성해야 합니다.

옵션 A — .instructions.md 규칙 파일

mobiscroll-react.instructions.md 파일을 다운로드하여 .github/instructions/에 배치하세요:

your-project/
├── .github/
|   └── instructions/
|       └── mobiscroll-react.instructions.md
├── src/
└── package.json

.instructions.md 파일은 텍스트 기반 API 규칙을 제공하며 추가 설정이 필요 없습니다.

옵션 B — 확장 지시 파일 + MCP (3개 파일)

세 개의 확장 지시 파일을 다운로드하여 .github/instructions/에 배치하세요:

• mobiscroll-ui.instructions.md (오케스트레이터)
• mobiscroll-ui-react.instructions.md (React 규칙)
• mobiscroll-ui-theming.instructions.md (테마)

your-project/
├── .github/
|   └── instructions/
|       ├── mobiscroll-ui.instructions.md
|       ├── mobiscroll-ui-react.instructions.md
|       └── mobiscroll-ui-theming.instructions.md
├── src/
└── package.json

2단계: MCP 서버 연결

확장 지시 파일이 실시간 스키마 조회를 위해 호출할 수 있도록 Mobiscroll MCP 서버를 구성하세요.

프로젝트 루트에 .vscode/mcp.json을 생성하거나 편집하세요:

{
  "servers": {
    "mobiscroll": {
      "type": "http",
      "url": "https://mcp.mobiscroll.com/"
    }
  }
}

[!-warning] -warning "servers"이 아닌 "mcpServers"

VS Code는 루트 키로 "servers"을 사용합니다. Claude Code 및 Cursor와 같은 "mcpServers"이 아닙니다. 잘못된 키를 사용하면 오류 메시지 없이 구성이 자동으로 실패합니다.

your-project/
├── .vscode/
│   └── mcp.json
├── .github/
│   └── instructions/
│       ├── mobiscroll-ui.instructions.md
│       ├── mobiscroll-ui-react.instructions.md
│       └── mobiscroll-ui-theming.instructions.md
├── src/
└── package.json

범위	구성 파일	팀과 공유
작업 영역	프로젝트 루트의 .vscode/mcp.json	예, 커밋된 경우
사용자 프로필	MCP: 사용자 구성 열기로 열기	아니요, 모든 작업 영역에 적용

연결 확인: 명령 팔레트를 열고 MCP: 서버 목록을 실행하세요. mobiscroll 서버가 연결된 상태로 나타나야 합니다. 처음 사용 시 신뢰 대화 상자가 나타나면 승인하여 서버 시작을 허용하세요.

또는 명령 팔레트를 열고 MCP: 서버 추가를 실행하여 안내식 설정을 진행할 수 있습니다.

작동 방식

applyTo: "**"이 포함된 지시 파일은 모든 Copilot Chat 쿼리에 자동으로 적용되며 수동 참조가 필요 없습니다. 두 옵션 모두 다음을 포함합니다:

• 문서 URL — AI를 올바른 프레임워크 문서로 안내
• 컴포넌트 매핑 — 사용자 의도(예: "스케줄러")를 올바른 Mobiscroll API에 매핑
• 규칙 — 올바른 패키지 가져오기, CSS 로딩 및 API 사용 강제
• 제약 조건 — 프레임워크 간 혼용 및 API 환각 방지

Mobiscroll 질문을 직접 하세요:

How do I set up a weekly scheduler with Mobiscroll?

What options does the Eventcalendar timeline view accept?

Claude Code 설정

Claude Code용 Mobiscroll 플러그인을 설치하세요. 플러그인은 프레임워크 코딩 스킬과 MCP 서버를 단일 설치에 번들로 제공하므로 프로젝트별 구성 파일이 필요 없습니다.

1단계: 마켓플레이스 등록

Claude Code에서 Mobiscroll 플러그인 마켓플레이스를 등록하려면 다음을 한 번 실행하세요:

/plugin marketplace add acidb/mobiscroll-marketplace

2단계: 플러그인 설치

/plugin install mobiscroll@mobiscroll

[!-warning] -warning 플러그인 스킬은 자동 업데이트되지 않음

플러그인을 설치하면 스킬의 스냅샷이 생성됩니다. 마켓플레이스에 대해 자동 업데이트를 활성화하지 않으면 Claude Code가 최신 스킬을 자동으로 가져오지 않습니다. 최신 버전을 얻으려면 /plugin marketplace update mobiscroll && /plugin update mobiscroll@mobiscroll을 실행한 다음 /reload-plugins을 실행하세요.

3단계: MCP 서버 연결

플러그인에는 MCP 서버가 번들로 포함되어 있어 대부분의 설정에서 별도 구성이 필요 없습니다. 수동으로 구성하거나 팀과 공유하려면:

claude mcp add --transport http mobiscroll https://mcp.mobiscroll.com/

[!-warning] -warning VS Code 확장

Claude Visual Studio Code 확장을 사용하는 경우 프로젝트 범위로 추가하지 않으면 서버가 나타나지 않습니다. 아래의 다음 명령을 참조하세요.

팀과 서버를 자동으로 공유하려면 프로젝트 범위를 사용하세요:

claude mcp add --transport http --scope project mobiscroll https://mcp.mobiscroll.com/

이렇게 하면 프로젝트 루트에 .mcp.json이 생성되거나 업데이트됩니다. 해당 파일을 수동으로 만들 수도 있습니다:

{
  "mcpServers": {
    "mobiscroll": {
      "type": "http",
      "url": "https://mcp.mobiscroll.com/"
    }
  }
}

범위	CLI 플래그	구성 위치	팀과 공유
로컬 (기본값)	--scope local	~/.claude.json	아니요
프로젝트	--scope project	프로젝트 루트의 .mcp.json	예, 버전 관리를 통해
사용자	--scope user	~/.claude.json	아니요, 모든 프로젝트에 적용

[!-info] -info info

팀 저장소에는 --scope project을 사용하여 프로젝트를 클론할 때 모든 사람이 MCP 서버를 자동으로 받도록 하세요. [!-warning] -warning 디렉터리에서도 연결되어 있나요?

조직에서 Anthropic 디렉터리의 Mobiscroll 커넥터를 활성화한 경우, 이미 Claude 계정을 통해 서버를 보유하고 있을 수 있습니다. 프로젝트 범위의 .mcp.json 항목과 디렉터리 커넥터는 동일한 서버로 가는 두 경로이며, Claude Code는 사용자가 자신의 계정에서 커넥터를 승인할 때까지 프로젝트 항목을 로드 실패로 보고할 수 있습니다. 한 번 승인하면 둘 다 작동하거나, .mcp.json 항목을 제거하고 커넥터만 사용할 수 있습니다. 아래 Claude 앱 설정을 참조하세요.

연결 확인: Claude Code 내에서 /mcp을 실행하세요. 패널에는 연결된 각 서버와 해당 도구 수가 표시됩니다. 정상적인 연결은 최소한 하나의 도구와 함께 mobiscroll을 표시합니다.

작동 방식

설치가 완료되면 플러그인은 다음을 제공합니다:

• 스킬 — mobiscroll-ui은 프레임워크(React, Angular, Vue, JavaScript 또는 jQuery)를 감지하고 일치하는 프레임워크 하위 스킬을 로드하는 오케스트레이터 스킬입니다. 테마 관련 질문은 mobiscroll-ui-theming에서 처리합니다. 모든 스킬은 함께 설치됩니다.
• MCP 서버 — 번들된 Mobiscroll MCP 서버는 실시간 컴포넌트 스키마 조회, 코드 검증, 주문형 예제 검색을 제공하므로 Claude는 기억에서 추측하는 대신 현재 API를 기반으로 작업합니다. 다른 AI 출력과 마찬가지로 병합하기 전에 생성된 코드를 검토하세요.

Claude Code에 Mobiscroll 코드 작성을 요청하면 다음을 수행합니다:

1. resolveEnvironment을 통해 프레임워크와 Mobiscroll 버전을 감지합니다.
2. 관용적 규칙과 일치하는 프레임워크 스킬을 로드합니다.
3. props나 이벤트를 작성하기 전에 컴포넌트 스키마를 조회합니다.
4. 반환하기 전에 생성된 코드를 검증합니다.

Codex 설정

OpenAI Codex용 Mobiscroll 플러그인을 설치합니다. 플러그인은 프레임워크 코딩 스킬과 MCP 서버를 단일 설치로 번들합니다 — 프로젝트별 구성 파일이 필요 없습니다.

1단계: 마켓플레이스 등록

Codex에서 이 명령을 한 번 실행하여 Mobiscroll 플러그인 마켓플레이스를 등록합니다:

/plugins marketplace add acidb/mobiscroll-marketplace

2단계: 플러그인 설치

/plugins install mobiscroll@mobiscroll

[!-warning] -warning 플러그인 스킬은 자동 업데이트되지 않습니다

플러그인을 설치하면 스킬의 스냅샷이 생성됩니다 — Codex는 자체적으로 최신 스킬을 가져오지 않습니다. 언제든지 최신 상태를 유지하려면 마켓플레이스 카탈로그를 업데이트하고 플러그인을 다시 설치하세요: /plugins marketplace update mobiscroll, 그 다음 /plugins install mobiscroll@mobiscroll.

3단계: MCP 서버 연결

플러그인은 MCP 서버를 번들합니다 — 대부분의 설정에는 별도 구성이 필요 없습니다. 수동으로 구성하거나 팀과 공유하려면 ~/.codex/config.toml(전역) 또는 .codex/config.toml(프로젝트)에 추가하세요:

[mcp_servers.mobiscroll]
url = "https://mcp.mobiscroll.com/"

명령줄에서도 등록할 수 있습니다:

codex mcp add mobiscroll --url https://mcp.mobiscroll.com/

범위	구성 위치	팀과 공유
전역	~/.codex/config.toml	아니요, 모든 프로젝트
프로젝트	프로젝트 루트의 .codex/config.toml (신뢰할 수 있는 프로젝트만)	예, 버전 관리를 통해

[!-info] -info 정보

팀 저장소에는 프로젝트 수준의 .codex/config.toml을 사용하여 모든 사람이 프로젝트를 클론할 때 MCP 서버를 자동으로 받도록 하세요.

연결 확인: Codex 내에서 /mcp을 실행하세요. 패널에는 연결된 각 서버와 해당 도구 수가 표시됩니다. 정상적인 연결은 도구가 나열된 mobiscroll을 표시합니다.

작동 방식

설치가 완료되면 플러그인은 다음을 제공합니다:

• 스킬 — mobiscroll-ui은 프레임워크(React, Angular, Vue, JavaScript 또는 jQuery)를 감지하고 일치하는 프레임워크 하위 스킬을 로드하는 오케스트레이터 스킬입니다. 테마 관련 질문은 mobiscroll-ui-theming에서 처리합니다. 모든 스킬은 함께 설치됩니다.
• MCP 서버 — 번들된 Mobiscroll MCP 서버는 실시간 컴포넌트 스키마 조회, 코드 검증, 주문형 예제 검색을 제공하므로 Codex는 기억에서 추측하는 대신 현재 API를 기반으로 작업합니다. 다른 AI 출력과 마찬가지로 병합하기 전에 생성된 코드를 검토하세요.

Codex에 Mobiscroll 코드 작성을 요청하면 다음을 수행합니다:

1. resolveEnvironment을 통해 프레임워크와 Mobiscroll 버전을 감지합니다.
2. 관용적 규칙과 일치하는 프레임워크 스킬을 로드합니다.
3. props나 이벤트를 작성하기 전에 컴포넌트 스키마를 조회합니다.
4. 반환하기 전에 생성된 코드를 검증합니다.

Claude 앱 설정 — claude.ai, 데스크톱 및 모바일

MCP 서버는 Anthropic의 커넥터 디렉터리에 게시되어 있으므로 웹의 Claude, Claude Desktop 및 Claude 모바일 앱은 프로젝트 파일이나 CLI 명령 없이 사용할 수 있습니다. 위의 편집기 설정과 동일한 서버입니다 — 차이점은 접근 방식뿐입니다.

1단계: 디렉터리에서 연결

설정 → 커넥터 → 커넥터 찾아보기를 열고 Mobiscroll을 검색한 다음 연결을 클릭합니다.

구성할 항목이 없습니다. 서버는 읽기 전용이며 계정, API 키 또는 OAuth 로그인이 필요 없습니다.

2단계: 조직에 대해 활성화 (Team 및 Enterprise)

Team 및 Enterprise 요금제에서는 소유자가 먼저 조직에 커넥터를 추가합니다. 그런 다음 각 구성원이 자신의 계정에서 연결합니다 — 커넥터는 모든 사람에게 표시되지만 개별 구성원이 연결할 때까지 응답하지 않습니다.

[!-warning] -warning 이미 사용자 지정 커넥터로 추가하셨나요?

디렉터리에 있기 전에 mobiscroll을 수동으로 추가한 경우, 디렉터리에서 연결하기 전에 해당 항목을 제거하세요. https://mcp.mobiscroll.com/을 가리키는 두 항목은 동일한 도구를 두 번 등록하며, Claude는 예상하지 못한 복사본을 호출할 수 있습니다.

설정 → 커넥터를 열고 사용자 지정 mobiscroll 항목을 찾아 제거하세요. 그런 다음 디렉터리에서 연결하세요.

작동 방식

Claude는 아래 MCP 도구 참조에 나열된 동일한 14개의 읽기 전용 도구를 호출합니다. 컴포넌트의 옵션, 이벤트 시그니처, Connect 엔드포인트 또는 REST 호출의 SDK 등가물에 대해 물어보면 기억에서 답하는 대신 현재 스키마를 읽습니다.

디렉터리 커넥터에는 스킬이 포함되지 않습니다. 스킬은 Claude Code 및 Codex 플러그인의 일부입니다 — 프로젝트 내에서 Mobiscroll 코드를 작성하려면 위의 Claude Code 설정을 사용하세요.

MCP 도구 참조

MCP 서버는 14개의 도구를 노출합니다. 모두 읽기 전용이며 그렇게 주석 처리되어 있으므로 AI 어시스턴트는 매번 확인을 요청하지 않고 호출할 수 있습니다. 그 중 어느 것도 Mobiscroll 계정의 데이터를 읽거나 쓰지 않으며, Connect 도구는 Connect API를 호출하는 대신 설명합니다.

Mobiscroll UI 도구

도구	반환 내용	필요 사항
resolveEnvironment	프로젝트가 사용하는 프레임워크와 주요 버전으로, package.json에서 읽습니다. 이는 다른 UI 도구가 인수로 사용하는 값입니다.	package.json 내용
listComponents	프레임워크와 버전에 사용 가능한 모든 컴포넌트와 간단한 설명 및 엔티티 수.	framework, major
getComponentSchema	한 컴포넌트의 옵션, 이벤트, 메서드 및 렌더러. 먼저 간결한 인덱스를 반환합니다. 전체 세부 정보를 보려면 특정 이름으로 다시 호출하세요.	component, framework, major
searchExamples	키워드와 일치하는 예제로, 컴포넌트와 버전으로 필터링되고 관련성순으로 정렬됩니다.	framework, major
getExampleById	소스 파일, 설명 및 구현 메모가 포함된 전체 예제.	exampleId, framework, major
validateCode	스니펫의 알 수 없는 props, 이벤트 및 메서드와 더 이상 사용되지 않는 사용법. 정적 분석 — 실행되는 것은 없습니다.	component, framework, major, snippet

Mobiscroll Connect 도구

동일한 서버는 Connect REST API 및 해당 SDK에 대한 질문에도 답변합니다. 이는 Connect AI 통합 가이드에 전체 문서화되어 있습니다.

도구	반환 내용	필요 사항
resolveConnectEnvironment	프로젝트가 의존하는 Connect SDK 및 버전으로, 종속성 매니페스트에서 읽습니다.	매니페스트 내용
listConnectEndpoints	모든 Connect REST 엔드포인트와 메서드, 경로, 요약 및 인증.	—
getConnectEndpointSchema	한 엔드포인트 전체: 유형이 있는 매개변수, 인증, 응답 상태, 예제.	endpointId 또는 method + path
listConnectSdkMethods	한 언어의 SDK가 노출하는 리소스 및 메서드.	language
getConnectSdkMethod	한 SDK 메서드 전체: 시그니처, 매개변수, 반환 유형, 문서 주석, 예제.	language, method
searchConnect	REST 엔드포인트와 SDK 메서드 전반의 키워드 일치.	query
mapConnectEndpointToSdk	REST 엔드포인트에 해당하는 SDK 호출(각 언어 또는 하나).	endpointId 또는 method + path
getConnectErrorTaxonomy	각 오류 범주와 HTTP 상태 및 언어별 관용적 예외 유형.	—

[!-success] -success resolve 호출로 시작하세요

서버는 원격으로 실행되며 파일을 읽을 수 없으므로 resolveEnvironment 및 resolveConnectEnvironment은 매니페스트 내용을 인수로 사용합니다. 다른 모든 도구는 이미 알고 있는 경우 프레임워크, 버전 또는 언어를 직접 허용합니다.

프레임워크 격리

[!-warning] -warning 중요

각 규칙 파일 및 문서 소스는 정확히 하나의 프레임워크 또는 도메인을 대상으로 합니다. 다른 프레임워크의 파일을 결합하거나 UI 프레임워크 파일과 Connect 파일을 혼합하지 마세요.

이것이 중요한 이유:

• 대부분의 API 옵션은 프레임워크 간에 공유되지만 컴포넌트 사용법과 템플릿은 각각 다릅니다 — 혼합하면 깨진 코드가 생성됩니다

Mobiscroll Connect는 별도의 도메인입니다:

• Connect는 백엔드 통합 계층입니다 — OAuth 2.0, REST API, 웹훅, 캘린더 동기화
• UI 컴포넌트, JSX, 프론트엔드 프레임워크 바인딩이 없습니다
• Connect는 mobiscroll-connect.mdc 및 llms-connect-full.txt을 사용합니다 — UI 프레임워크 파일은 절대 사용하지 마세요
• Connect 문서와 UI 문서를 혼합하면 AI가 REST 엔드포인트와 컴포넌트 API를 혼동하게 됩니다

[!-info] -info 정보

mobiscroll@mobiscroll 플러그인은 서버 측 Connect(OAuth, REST, 캘린더 동기화)용 mobiscroll-connect 스킬도 번들합니다. 백엔드 Connect 작업에만 활성화되며 UI 컴포넌트 코드와 혼합되지 않습니다. Connect AI 통합 가이드를 참조하세요.

규칙:

1. 하나의 프레임워크 또는 도메인과 일치하는 규칙 파일만 사용하세요 — 다른 프레임워크의 파일을 혼합하지 마세요
2. Cursor에 하나의 문서 소스만 등록하세요
3. 프로젝트가 여러 프레임워크를 사용하는 경우(예: 마이크로 프론트엔드), 별도의 .mdc 파일이 있는 별도의 디렉터리를 설정하세요
4. 프로젝트가 UI 프레임워크와 Mobiscroll Connect를 모두 사용하는 경우, 각각 별도의 AI 컨텍스트 디렉터리를 사용하세요
5. AI 어시스턴트가 잘못된 프레임워크 가져오기로 코드를 생성하는 경우, 올바른 규칙 파일이 있는지 확인하세요

예제 쿼리

이 예제는 AI 통합이 올바르게 처리하도록 설계된 질문 유형을 보여줍니다.

How do I create an Eventcalendar with a weekly scheduler view?
Add drag and drop support to my Mobiscroll timeline.
What is the type for calendar events in Mobiscroll React?

문제 해결

AI가 잘못된 프레임워크로 코드를 생성합니다

증상: React를 사용 중인데 AI가 다른 프레임워크(예: import { Eventcalendar } from '@mobiscroll/angular')용 코드를 생성합니다.

해결 방법: 올바른 규칙 파일이 있는지 확인하세요. Cursor에서 React를 사용하려면 mobiscroll-react.mdc을 사용하세요. Copilot의 경우 mobiscroll-react.instructions.md을 사용하세요. Cursor에서 등록된 @docs 소스가 llms-react-full.txt을 가리키는지 확인하세요.

AI가 존재하지 않는 API를 생성합니다

증상: AI가 Mobiscroll 문서에 존재하지 않는 옵션, 이벤트 또는 유형을 제안합니다.

해결 방법: .mdc 규칙은 AI가 문서에서 찾은 API만 사용하도록 지시합니다. 그래도 발생하는 경우 Cursor 쿼리에서 @docs을 명시적으로 참조하거나 Claude Code(/plugin list) 또는 Codex(codex plugin list)에 Mobiscroll 플러그인이 설치되어 있는지 확인하세요. AI에게 Mobiscroll 문서에 옵션이 존재하는지 확인하도록 요청할 수도 있습니다.

AI가 Mobiscroll Connect와 UI 컴포넌트를 혼합합니다

증상: 프론트엔드 캘린더 컴포넌트에 대해 물었는데 AI가 REST API 호출을 생성하거나, Connect API에 대해 물었는데 JSX/컴포넌트 코드를 생성합니다. 수정: Mobiscroll Connect는 백엔드 통합 계층(OAuth, REST, 웹훅)이며 UI 구성 요소가 없습니다. Eventcalendar는 REST API가 없는 프런트엔드 UI 구성 요소입니다. 이 둘은 완전히 별개의 .mdc 파일과 문서 소스를 사용합니다. 프로젝트에 올바른 .mdc 파일이 활성화되어 있는지 확인하세요. 동일한 코드베이스에서 둘 다 사용하는 경우 각각에 대해 별도의 AI 컨텍스트 디렉터리를 유지하세요.

설정 후 MCP 서버가 표시되지 않음

증상: MCP 서버 패널에 mobiscroll 항목이 표시되지 않거나 도구를 사용할 수 없습니다.

수정: 구성 파일이 올바른 위치에 있고 올바른 루트 키를 사용하는지 확인하세요 — Claude Code, Codex 및 Cursor의 경우 mcpServers, VS Code의 경우 servers. 파일이 올바른 형식의 JSON인지 검증하세요. Claude Code 또는 Codex의 경우 /mcp를 실행하여 연결된 서버를 검사하세요.

파일 참조

모든 AI 통합 파일은 다음 URL에서 사용할 수 있습니다:

문서 파일

파일	URL
React	https://mobiscroll.com/docs/llms-react-full.txt

규칙 파일

파일	Cursor (.mdc)	Copilot (.instructions.md)
React 규칙	mobiscroll-react.mdc	copilot-instructions/mobiscroll-react.instructions.md

확장 규칙 파일

파일	Cursor (.mdc)	Copilot (.instructions.md)
오케스트레이터	mobiscroll-ui.mdc	copilot-instructions/mobiscroll-ui.instructions.md
React 규약	mobiscroll-ui-react.mdc	copilot-instructions/mobiscroll-ui-react.instructions.md
테마	mobiscroll-ui-theming.mdc	copilot-instructions/mobiscroll-ui-theming.instructions.md

파일 내용

각 파일의 전체 내용은 아래에 표시됩니다. 이 블록에서 직접 복사하거나 위의 다운로드 링크를 사용할 수 있습니다.