[Vue.js] Vue 초기 프로젝트 생성 관련 명령어(feat.vite)
2021. 3. 11. 11:01ㆍVue.js
https://codepen.io/jangka44/live/KKNWBVQ
### 1. node 설치 ###
- 설치확인
cmd에서 node -v
- npm 버전확인
npm -v
- npm 업데이트 명령어
npm install -g npm
### 2. vite로 새 프로젝트 생성 ###
- 프로젝트 생성
cmd에서 mkdir c:\work && mkdir c:\work\vite_projects
cd c:\work\vite_projects
npm init @vitejs/app
- 프로젝트명 : 프로젝트명
- 템플릿 : 선택
- 생성된 프로젝트로 이동
cd 프로젝트명
- 의존성 설치
npm i
- 프로젝트 개발용으로 실행
npm run dev
브라우저에서 http://localhost:3000 접속
### 3. 테일윈드 적용 ###
- 의존성 설치
cmd에서 npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
npx tailwindcss init -p
tailwind.config.js에서 아래 코드 삽입
purge: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
### 4. 라우터 적용 ###
- 의존성 설치
cmd에서 npm install vue-router@4
'Vue.js' 카테고리의 다른 글
[Vue 3.0 기초] 2강:setTimeout, ref (0) | 2021.03.23 |
---|---|
[Vue 3.0 기초] 1강: 워밍업 (0) | 2021.03.23 |
[Vue.js] TodoList 만들기(연습2-내용정리, component 적용, 초기화 기능 구현 등) (0) | 2021.03.10 |
[Vue.js] VITE 개념(feat.CLI) (0) | 2021.03.10 |
[Vue.js] TodoList 만들기(연습) (0) | 2021.03.09 |