본문 바로가기
IT/Visual Studio Code

[Visual Studio Code] - vscode Vue.js 확장 프로그램 종류 및 설치 방법

by 차이나는 개발자 2023. 8. 20.
728x90
반응형

#Vue.js 확장 프로그램 종류

Vue.js는 많은 확장 프로그램(Extensions)이 있어서 다양한 기능을 추가할 수 있습니다. 

일부 인기있는 Vue 확장 프로그램은 다음과 같습니다:

1. Vuex: Vue.js 애플리케이션의 상태 관리를 위한 공식 상태 관리 라이브러리입니다.
2. Vue Router: Vue.js 애플리케이션의 라우팅을 관리하기 위한 공식 라우터입니다.
3. Vue CLI: Vue.js 프로젝트를 위한 개발 환경 구축 및 프로젝트 생성을 도와주는 명령줄 도구입니다.
4. Vuetify: Vue.js를 위한 인기 있는 UI 컴포넌트 프레임워크입니다.
5. Vue Devtools: Vue.js 개발을 위한 브라우저 확장 프로그램으로, Vue 컴포넌트의 계층 구조, 상태, 이벤트 등을 디버깅할 수 있습니다.

6. Vetur: Vue.js 개발을 위한 확장 프로그램 중 하나입니다. 이 확장 프로그램은 Vue.js 프로젝트에서 코드 작성, 디버깅, 코드 스니펫 생성 등을 돕습니다.

7. Debugger for Chrome (deprecated): Visual Studio Code에서 Google Chrome을 디버깅하기 위한 확장 프로그램입니다. 이 확장 프로그램을 사용하면 JavaScript 및 TypeScript 코드를 디버깅하고, 브라우저와의 상호작용을 확인할 수 있습니다.

8. Prettier -  Code formatter: 코드 포맷터 중 하나로, 코드를 일관된 스타일로 자동으로 정리해 주는 도구입니다. 코드 스타일 가이드를 준수하고 일관된 코드를 유지하는 데 도움을 줍니다.

9. JavaScript Debugger: JavaScript Debugger는 JavaScript 코드를 디버깅하기 위한 도구 중 하나입니다. 브라우저에서 제공하는 개발자 도구를 통해 JavaScript 코드 디버깅을 수행할 수 있습니다.


이 외에도 다양한 Vue 확장 프로그램이 있으며, 프로젝트의 요구 사항에 따라 선택할 수 있습니다. Vue.js 공식 홈페이지나 npm 등에서 더 많은 Vue 확장 프로그램을 찾아볼 수 있습니다.

 

 

#vc code에서는 확장프로그램 다운로드를 통해서 다양한 플로그인들을 다운로드할 수 있습니다.

1. vs code 를 실행하고 좌측 메뉴에서 Extensions를 클릭합니다.

(단축키: Ctrl + Shift + X)

 

 

2. Vetur 설치를 위해서 검색창이 Vetur을 검색하고 다운로드 받습니다.

 

 

3. Prettier - Code formatter 설치를 위해 검색창에 Prettier - Code formatter를 검색하고 다운로드합니다.

 

 

 

728x90
반응형

댓글