Vue:설치 및 개발환경 세팅: 두 판 사이의 차이
둘러보기로 이동
검색으로 이동
잔글 (Sam님이 Vue:개발환경 세팅 문서를 Vue:설치 및 개발환경 세팅 문서로 이동했습니다) |
(→vscode) |
||
| (같은 사용자의 중간 판 2개는 보이지 않습니다) | |||
| 1번째 줄: | 1번째 줄: | ||
{{Vue}} | {{Vue}} | ||
= 공통 = | =공통= | ||
{| class="wikitable" | {| class="wikitable" | ||
!과정 | !과정 | ||
| 9번째 줄: | 9번째 줄: | ||
|Node.js 설치 | |Node.js 설치 | ||
|가능하면 기본 경로는 변경하지 말자. | |가능하면 기본 경로는 변경하지 말자. | ||
npm(라이브러리 설치도우미)을 이용하기 위해 설치. | |||
|https://nodejs.org/ko/download/ | |https://nodejs.org/ko/download/ | ||
|} | |} | ||
= IDE별 = | =IDE별= | ||
== vscode == | ==StackBlitz== | ||
브라우저 기반 IDE. 바로 사용하면 된다. | |||
https://stackblitz.com/edit/vitejs-vite-qxutdl?file=index.html&terminal=dev | |||
==vscode== | |||
{| class="wikitable" | {| class="wikitable" | ||
!과정 | !과정 | ||
| 31번째 줄: | 37번째 줄: | ||
|확장기능은 다음과 같은 것이 추천된다. | |확장기능은 다음과 같은 것이 추천된다. | ||
* Vetur | *Vetur(Volar??인가? 공식문서에선 Volar을 추천) | ||
* HTML CSS Support | *HTML CSS Support | ||
* Vue 3 snippets : 자동완성. | *Vue 3 snippets : 자동완성. | ||
|vscode extension에서 설치한다. | |vscode extension에서 설치한다. | ||
|} | |} | ||
2022년 7월 2일 (토) 09:30 기준 최신판
공통[편집 | 원본 편집]
| 과정 | 설명 | 방법 |
|---|---|---|
| Node.js 설치 | 가능하면 기본 경로는 변경하지 말자.
npm(라이브러리 설치도우미)을 이용하기 위해 설치. |
https://nodejs.org/ko/download/ |
IDE별[편집 | 원본 편집]
StackBlitz[편집 | 원본 편집]
브라우저 기반 IDE. 바로 사용하면 된다.
https://stackblitz.com/edit/vitejs-vite-qxutdl?file=index.html&terminal=dev
vscode[편집 | 원본 편집]
| 과정 | 설명 | 방법 |
|---|---|---|
| vue cli 설치 | 뷰 개발환경 세팅을 돕는 프로그램.
터미널에서 진행 |
npm install -g @vue/cli
npm이 안도면 yarn을 다운받아 사용해보자. yarn global add @vue/cli |
| 에디터 부가기능 설치 | 확장기능은 다음과 같은 것이 추천된다.
|
vscode extension에서 설치한다. |