2021-07-05
vue3 가 안정정? 이어서 그대로 쓰도록 하겠다.
@vue/cli 가 정상적으로 설치되었으면, 실행시 템플릿을 선택하여 생성가능
# 템플릿 이용
vue create vue-project
Default (Vue3)([Vue3 ] babel, eslint ) <<- 선택!
- router 추가
vue add router
# 메뉴얼로 생성
vue create vue-project-manually
Manually select features <<- 선택
-- 아래 5가지 선택
Choose Vue version
Babel
Router
Vues
Linter / Formatter
-- vue 3.x 선택
-- Use history mode for router? ---> Y
-- ESLint + Standard config
-- Lint on save
-- In package.json
-- 템플릿 재사용을 위해
Save this as a preset for future project ? yes 를 하고
이름을 지정함 ex) vue basic
## vue ui 로 ui 인터페이스로 생성도 가능!!
# 플러그인 추가!
- 크롬 플러그인
https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg
vue3 용 플러그인으로 꼭! 설치
- vscode 플러그인
Vetur
Debugger for Chrome
Prettier - Code formatter
2021-06-14
환경: Windows10 Home 20H2
node 14.16.1
vue가 2020년 에 vue3 가 릴리즈되었다.
그리고 vue-cli 도 버전에 따라 차이가 좀 있었다.
최종적으로 아직은 안정적이지 않은 vue3 대신 vue2를 쓰고,
vue-cli 는 4 버전을 써서 생성을 하는걸로 다시 수정한다.
vue-cli 도 이름이 @vue/cli 로 바뀌었다.
# 기존버전 설치했으면 삭제
npm uninstall -g vue-cli
# 신규 vue-cli 설치 -> 4.5.13 설치함!
npm i -g @vue/cli
# @vue/cli 에서 생성하기
vue create to-do --default -> 명령어가 create 로 바뀜!
# 테스트 서버 띄우기
npm run serve -> dev 에서 serve 로 바뀜!
# 설정관련 참고
BASE_URL 등의 환경변수 설정하기
-----------------------------------------------------------------------------------------------
환경: Windows10 Home 20H2
node 14.15.1
# vue-cli 설치
npm i vue-cli -g
# vue-cli 로 프로젝트 생성
vue init webpack-simple
# 모듈 다운로드
npm i
# 실행하기
npm run dev
# 빌드
npm run build
vue 시작하기
https://kr.vuejs.org/v2/guide/index.html
vuex (상태관리)