Tailwind 사용자에게 추천하는 Tailwind CSS IntelliSense

clock icon

posted 2 months ago

Tailwind CSS IntelliSense

VS Code Tailwind CSS IntelliSense 확장은 Tailwind CSS를 사용하는 개발자들을 위한 유용한 도구 중 하나입니다. 이 확장은 Tailwind CSS 클래스를 쉽게 찾고 삽입할 수 있도록 도와주며, 개발 작업을 더욱 효율적으로 만들어줍니다.

사용법

  1. 나열되는 클래스 목록에서 화살표 키를 사용하여 원하는 클래스를 선택하거나, 시작하는 문자를 입력하여 필터링 할 수 있습니다.
  2. 선택한 클래스를 Enter 키를 눌러 삽입하거나 Tab 키를 사용하여 다음 클래스로 이동합니다.
  3. 클래스를 삽입한 후에도 마우스로 클래스 이름 위에 호버하면 해당 클래스의 미리보기를 볼 수 있습니다.

Installation

"Import Cost"는 개발자가 코드의 모듈 크기를 파악하고 성능을 개선하기 위해 유용한 Visual Studio Code 확장입니다. 그러나 프로젝트의 특서엥 따라 필요한지를 판단하여 사용하는 것이 중요합니다.

  1. Visual Studio Code를 실행합니다.
  2. 왼쪽 사이드바에서 "Extensions" 아이콘(네모난 아이콘)을 클릭합니다.
  3. 검색창에 "Tailwind CSS IntelliSense"를 입력하고 해당 확장을 찾습니다.
  4. 확장 설치 버튼을 클릭하여 설치합니다.