vscode 에서 ctrl + 클릭 시 CSS 파일로 바로 이동하지 못하는 문제 해결 방법

문제 예시

• Next 등에서 import 된 styles를 클릭했을 때 스타일 정의된 CSS/SCSS 파일로 이동하지 않고 global.d.ts 파일로 이동하는 상황.

  • TypeScript 프로젝트에서 CSS 모듈을 사용하는 경우 흔히 발생하는 문제.

해결 방법: CSS Modules 확장 프로그램 설치 및 사용

1. CSS Modules 확장 프로그램 설치

   • VSCode 마켓플레이스에서 CSS Modules 확장 프로그램을 검색하고 설치.

     • CSS Modules 확장 프로그램 링크

2. 사용법

   • Ctrl+Click (Windows/Linux) 또는 Cmd+Click (Mac):

     • import된 CSS/SCSS 모듈을 클릭하면 정의된 파일로 바로 이동 가능.