[Vue.js] CLI 설치하기

# 로컬 설치
npm install @vue/cli
# 전역 설치
npm install -g @vue/cli
# 업데이트
npm update @vue/cli
# 삭제
npm uninstall @vue/cli

 

npm 경로 확인

npm config get prefix

 

오류 날 경우 : 환경변수 Path에 추가

C:\Users\{YourUse}\AppData\Roaming\npm

 

project 생성

vue create vue-test

 

 

vue-router 설치

npm install vue-router --save

 

bootstrap vue 설치

npm install vue bootstrap-vue bootstrap

bootstrap-vue.org/docs

BootstrapVue

main.js 에 아래 부분 추가 한다.

import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'

// Install BootstrapVue
Vue.use(BootstrapVue)
// Optionally install the BootstrapVue icon components plugin
Vue.use(IconsPlugin)

 

import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'

 

<main.js>

import Vue from 'vue'
import App from './App.vue'
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'

// Install BootstrapVue
Vue.use(BootstrapVue)
// Optionally install the BootstrapVue icon components plugin
Vue.use(IconsPlugin)

import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
}).$mount('#app')

 

.vue 파일에서 <template></template> 사이에는 html 코드 작성

<script>

export default {

    name: "header",

}

</script>