도구 연결(MCP)
Chrome DevTools MCP
AI가 Chrome 페이지를 검사해 오류와 로딩 성능을 조사합니다.
소개
공개 문서를 바탕으로 LessAI Tools가 정리
페이지 오류, 화면 깨짐, 느린 로딩을 조사하도록 Chrome 개발자 검사 기능을 AI에 제공합니다. 개발자는 페이지 동작과 성능 정보를 살펴볼 수 있습니다. Chrome과 MCP 호환 도우미가 필요하며, 조사 결과는 문제 해결을 돕지만 사이트 전체에 문제가 없음을 증명하지는 않습니다.
시작하기
필요 조건을 확인하고 AI 도우미를 선택해 연결 단계를 보세요.
- 준비 사항
- Node.js LTS와 npm.
- 지원되는 Chrome 또는 Chrome for Testing.
- 비용
- 프로젝트 코드는 오픈 소스입니다. 도우미 이용과 외부 서비스 한도는 별도입니다.
- 필요 권한
- 브라우저 내용을 검사·수정합니다. 통계는 기본 활성화이며 성능 도구가 CrUX 조회에 URL을 보낼 수 있습니다. 해제법은 README에 있습니다.
Codex공식 연결 문서 있음
클라이언트 안내에 Codex 설정이 있습니다.
연결 단계
- Node.js LTS·npm·Chrome 설치를 확인하세요.
- 클라이언트 설정의 Codex 항목을 따르세요.
- 다시 열면 브라우저 도구를 처음 쓸 때 Chrome이 시작됩니다.
연결 결과 확인
공개 페이지 콘솔 오류를 검사해 실제 발견한 내용을 보고하게 하세요.
공식 출처
Claude Code공식 연결 문서 있음
클라이언트 안내에 Claude Code 설정이 있습니다.
연결 단계
- Node.js LTS·npm·Chrome 설치를 확인하세요.
- 클라이언트 설정의 Claude Code 항목을 따르세요.
- 다시 열면 브라우저 도구를 처음 쓸 때 Chrome이 시작됩니다.
연결 결과 확인
공개 페이지 콘솔 오류를 검사해 실제 발견한 내용을 보고하게 하세요.
공식 출처
Cursor공식 연결 문서 있음
클라이언트 안내에 Cursor 설정이 있습니다.
연결 단계
- Node.js LTS·npm·Chrome 설치를 확인하세요.
- 클라이언트 설정의 Cursor 항목을 따르세요.
- 다시 열면 브라우저 도구를 처음 쓸 때 Chrome이 시작됩니다.
연결 결과 확인
공개 페이지 콘솔 오류를 검사해 실제 발견한 내용을 보고하게 하세요.
공식 출처
공식 출처
연결 안내 확인일 2026-10-12 · 공개 문서를 기반으로 합니다. 모든 프로젝트를 직접 설치해 테스트하지는 않았습니다.
활용 방법
- 페이지 동작과 브라우저 문제 검사
- 로딩과 성능 조사
- Chrome 준비 및 도우미 연결 안내 확인
공식 프로젝트 및 문서
프로젝트 설명(번역)
코딩 에이전트용 Chrome 개발 도구
비슷한 작업의 플러그인
주요 용도를 우선하고 공통 작업과 스타 수를 참고합니다. 연결 방법은 다를 수 있습니다.
- Playwright MCP — AI가 페이지 탐색, 버튼 클릭, 폼 입력으로 웹 흐름을 확인합니다.
- BrowserTools MCP — Chrome 세션의 오류, 네트워크 활동, 스크린샷을 AI와 공유합니다.
- ExecuteAutomation Playwright MCP — ExecuteAutomation Playwright MCP: 브라우저에서 웹페이지 조작 (MCP 호환 AI 도우미를 통해).