VS Code 설정 튜토리얼
VS Code + Cline에서 OpenAI Compatible 방식으로 LLM API Gateway을 연동합니다.
목표: VS Code에 Cline을 설치하고 OpenAI Compatible 방식으로 LLM API Gateway을 연동합니다. 설정을 완료하면 VS Code에서 바로 AI가 코드를 읽고, 수정하고, 명령을 작성하고, 오류를 설명하도록 할 수 있습니다.
| 설정 항목 | 입력 내용 | 비고 |
|---|---|---|
| API Provider | OpenAI Compatible | Cline에서 OpenAI 호환 서비스 제공자를 공식 지원합니다. |
| Base URL | https://api.llm-token.cn/v1 | 전체 /chat/completions 경로를 입력하지 마십시오. |
| API Key | sk-xxxxxxxx | 본인의 전체 Key를 붙여 넣습니다. |
| Model ID | 모델 목록에서 전체 모델 이름 복사 | 모델이 존재하지 않는다면 대부분 이 항목을 잘못 입력한 경우입니다. |
일, 사전 준비
- VS Code 설치: https://code.visualstudio.com/
- Git 설치: https://git-scm.com/downloads
- Windows 사용자는 Git 설치 후 환경 변수가 적용되도록 컴퓨터를 한 번 재시작하는 것이 좋습니다.
이, Cline 확장 프로그램 설치
- VS Code를 열고 왼쪽의 Extensions 확장 프로그램 스토어를 클릭합니다.
- Cline을 검색한 뒤 Install을 클릭합니다.
- 설치가 완료되면 왼쪽에 Cline 아이콘이 표시됩니다.
- 아이콘이 나타나지 않으면 VS Code를 재시작합니다.
VS Code에서 Cline 플러그인을 검색하는 화면을 보여 줍니다. 왼쪽에 여러 아이콘이 있고 그중 ‘확장 프로그램’ 아이콘이…
삼, Cline 설정 열기
왼쪽의 Cline 아이콘을 클릭하여 Cline 패널로 이동한 뒤 설정을 엽니다.
이 이미지는 VS Code에서 Cline 설정 단계의 인터페이스 스크린샷으로, 설정 튜토리얼에서 Cline 설정을 연 뒤 수행하는…
이미지는 VS Code에서 Cline 플러그인의 설정 화면을 보여 줍니다. 화면 왼쪽에는 ‘API Configuration’, ‘…
위 이미지는 Cline 필드 위치를 파악하는 데만 사용합니다. 이미지 속 타사 http://... 주소와 모델 이름은 LLM API Gateway 설정이 아니므로 그대로 따라 입력하지 마십시오. 실제 값은 이 문서 표의 HTTPS Base URL와 사이트 모델 목록을 기준으로 합니다.
사, LLM API Gateway 인터페이스 입력
- API Provider: OpenAI Compatible을 선택합니다.
- Base URL:
https://api.llm-token.cn/v1을 입력합니다. - API Key:
sk-로 시작하는 본인의 Key를 붙여 넣습니다. - Model ID: 전체 모델 ID를 입력합니다. 예:
claude-sonnet-4-6. - 구성을 저장한 뒤 새 작업을 만들어 테스트합니다.
저장할 때 오류가 발생하는 경우: 먼저 Base URL를 https://api.llm-token.cn/v1/chat/completions로 작성하지 않았는지 확인하십시오. Cline에는 API 루트 경로, 즉 /v1을 입력해야 합니다.
오, 테스트 및 문제 해결
| 현상 | 처리 방법 |
|---|---|
| URL을 입력할 수 없음 | 일반 OpenAI 공식 제공자가 아니라 OpenAI Compatible을 선택했는지 확인하십시오. |
| Model Not Found | 모델 ID가 모델 목록과 완전히 일치해야 합니다. |
| 연결 실패 | Key, Base URL, 네트워크 프록시를 확인하십시오. 회사 네트워크나 캠퍼스 네트워크에서는 모바일 핫스팟으로 바꾸어 테스트할 수 있습니다. |
| Cline 아이콘이 없음 | VS Code를 재시작하고, 그래도 나타나지 않으면 확장 프로그램을 다시 설치하십시오. |