Visual Studio Code를 사용하는 데 유용한 10가지 확장을 권장합니다.
* 컬러라이저 2 브래킷 쌍 – 내장
Bracket Pair Colorizer 2는 더 이상 별도로 설치할 필요가 없습니다. 내장되어 있기 때문입니다.
Bracket Pair Colorizer 2의 경우 다음과 같이 { }의 pairing을 확인하면 매우 편리합니다.
1.css 컴팩트
CSS 컴팩트의 경우 시프트+알트+F 키별로 CSS를 한 줄로 정렬할 수 있습니다. CSS 기술이 어느 정도 향상됨에 따라 한 줄로 코드를 작성하는 것이 가독성과 관리 용이성에 더 좋습니다. 이 기능 CSS 파일만에서만 가능합니다
다음과 같이 코드를 한 줄로 정리하면 편리합니다. (시프트+알트+F 단추)
2. 자료 주제
머티리얼 디자인은 Visual Studio Code 테마를 적용할 수 있습니다. 다양한 테마 중에서 선택하세요.
왼쪽의 확장 메뉴를 선택하고 Material Theme 항목을 클릭한 후 다음과 같이 테마를 선택합니다.
3. 재료 기호의 주제
Material Icon Theme는 문서의 아이콘을 적용합니다.
머티리얼 아이콘 테마를 적용한 이미지입니다. 거의 파일별로 적용됩니다. 귀여운.
4. 아름다운 코드 포맷터
요컨대 코드 포맷터입니다. 기본적으로 많은 분들이 사용하고 있습니다. 설정을 통해 취향에 맞게 조정할 수 있습니다. 그냥 기본값을 사용해도 괜찮습니다.
5. 브라우저에서 열기
브라우저에서 미리 볼 수 있는 유용한 기능이 있는 단축키 Alt+B사용.
6. 레인보우 들여쓰기
코드를 멋지게 들여쓰기할 수 있습니다.
코드는 다음과 같이 멋지게 들여쓰기되어 있습니다. 좋습니다.
7. 자동으로 태그 이름 바꾸기
코드를 자동으로 수정할 수 있는 매우 편리한 확장 프로그램입니다.
다음과 같이 여는 태그를 변경하면 닫는 태그도 자동으로 변경됩니다. 매우 유쾌합니다.
8. CSS 픽
HTML로 작업할 때 관련 CSS 클래스 또는 ID로 바로 이동할 수 있는 매우 편리한 확장 프로그램입니다. 설치 후 작동하려면 Visual Studio Code를 다시 실행해야 합니다.
Ctrl 키누른 상태에서 클릭하면 다음과 같이 바로 이름이 나타나며 CSS 파일로 이동하여 수정할 수 있습니다.
9. HTML CSS 지원
HTML CSS 지원은 CSS 파일에 선언된 클래스나 ID를 직접 선택하여 적용할 수 있어 매우 편리합니다.
다음과 같이 선택기가 바로 나타나므로 매우 편리합니다.
10. 라이브 서버
Live Server는 HTML 문서를 서버처럼 실시간으로 검사할 수 있는 매우 편리한 확장 프로그램입니다.
마우스 오른쪽 버튼으로 클릭 라이브 서버로 열기실행하려면 클릭하세요.
위에서 10개의 확장 프로그램을 살펴보았습니다. 더 적은 손 통증으로 더 빠른 코딩.