# IDE 호환성 및 문제 해결
VS Code, Cursor, Windsurf에서 설치, 로그인, 미리 보기, System, 삽입, 다운로드, CDN 문제를 해결하세요.

확장 프로그램은 Visual Studio Code, Cursor, Windsurf를 지원하며 최소 VS Code API 버전은 `1.85.0`입니다.

## IDE별 차이

| 동작              | Visual Studio Code             | Cursor 및 Windsurf        |
| --------------- | ------------------------------ | ------------------------ |
| 확장 프로그램 설치      | VS Code Marketplace 또는 `.vsix` | IDE 마켓플레이스 또는 `.vsix`    |
| Getting Started | 기본 안내 화면을 엽니다.                 | LottieFiles 사이드바로 대체됩니다. |
| 사이드바, 미리 보기, 명령 | 지원                             | VS Code 호환 API를 통해 지원    |

파일 드롭, 로그인 후 복귀, 커스텀 에디터, 생성 파일 작업처럼 프로젝트와 관련된 흐름은 팀에서 실제로 사용하는 IDE에서 테스트하세요.

## 설치 및 첫 실행

- **Activity Bar 아이콘이 없음** - IDE 창을 다시 불러오고 확장 프로그램이 활성화되어 있는지 확인하세요.
- **Getting Started가 열리지 않음** - Command Palette에서 **LottieFiles: Open Sidebar**를 사용하세요.
- **JSON 파일이 잘못된 에디터에서 열림** - **Preview Animation**을 직접 실행하거나 `lottiefiles.directPreviewJson` 설정을 바꾸세요.

## 로그인 및 Workspace

- **브라우저 로그인은 끝났지만 사이드바에는 로그아웃으로 표시됨** - 원래 IDE 창으로 돌아가 계정 작업을 다시 여세요.
- **Workspace가 비어 있음** - 선택한 계정과 워크스페이스, 프로젝트 권한을 확인하세요.
- **업데이트한 파일이 보이지 않음** - Workspace 위치를 다시 열거나 새로 고치세요.
- **업로드가 거부됨** - 파일 형식과 용량, JSON 유효성, 요금제 제한을 확인하세요.

## System 탭

- **System이 보이지 않음** - 설치된 확장 프로그램 버전이나 현재 계정에 Motion System 기능이 아직 활성화되지 않았을 수 있습니다.
- **시스템 목록이 비어 있음** - Workspace에서 사용할 워크스페이스를 선택하고 해당 워크스페이스에 Motion System이 있는지 확인하세요.
- **섹션이 보이지 않음** - 게시된 버전에 VS Code에서 사용할 수 있는 프리미티브가 없을 수 있습니다.
- **Insert가 동작하지 않음** - 텍스트 에디터를 열고 커서를 놓은 뒤 Insert를 클릭하세요.

## 미리 보기 및 개발자 도구

- **Lottie JSON 미리 보기가 열리지 않음** - 문법 오류를 고치고 일반 JSON이 아니라 애니메이션 데이터인지 확인하세요.
- **`.lottie` 기능이 JSON에서 사라짐** - 멀티 애니메이션, 테마, 토큰 또는 상태 머신을 사용하려면 `.lottie` 출력을 유지하세요.
- **실시간 미리 보기가 갱신되지 않음** - JSON을 유효한 상태로 고친 뒤 저장하거나 미리 보기를 다시 불러오세요.
- **생성된 타입이 부족함** - 현재는 상태 머신 ID와 마커 이름 타입만 생성합니다.

## 다운로드 및 CDN

- **최적화된 출력이 잠겨 있거나 보이지 않음** - 요금제와 제공 여부, 최적화로 파일이 실제로 개선되는지에 따라 표시 여부가 달라집니다.
- **Animated SVG에 색상 변경이 적용되지 않음** - 내보내기에는 원본 애니메이션 소스가 사용됩니다.
- **CDN 작업이 보이지 않음** - 워크스페이스에서 CDN 링크를 비활성화할 수 있습니다.
- **Utilities Snippets에 임시 값이 표시됨** - Workspace 파일에서 CDN을 활성화하거나 소스를 프로젝트 경로로 바꾸세요.

## 로그 및 진단

오류가 발생한 뒤 확장 프로그램의 **Show Logs**를 사용하세요. 문제를 보고할 때는 확장 프로그램 버전, IDE와 버전, 파일 형식, 실행한 정확한 작업을 함께 적으세요. 공개 이슈에는 비공개 애니메이션 파일이나 접근 토큰을 첨부하지 마세요.

## 관련 문서

- [명령 및 설정](/ko/integrations/vscode/07_reference/commands-and-settings)
- [설치](/ko/integrations/vscode/01_quickstart/installation)