[Vue]기본 프로젝트 구성

사전작업

• Visual Studio 2019
• Vue 프로젝트(javascript)

프로젝트 시작하자마자 빌드하면, 오류발생
'vue-cli-service'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는
배치 파일이 아닙니다.

 

npm 폴더 아래 패키지들이 잘 설치 되었는지 확인

 

아래 패키지 제거 후 최신 버전으로 다시설치

npm install vue@2.6.14
npm install vue-template-compiler@2.6.14 -D

 

Vuetify 세팅

npm install vuetify

vuetify.js 생성

// src/plugins/vuetify.js

import Vue from 'vue'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'

Vue.use(Vuetify)

const opts = {}

export default new Vuetify(opts)

main.js  코드 추가

import vuetify from '@/plugins/vuetify'

new Vue({
    vuetify,
    ...
}).$mount('#app');

App.vue 테스트 코드 추가

<div id="app">
    <v-app>
        <v-main>
            <template>
                <v-row align="center"
                       justify="space-around">
                    <v-btn depressed>
                        Normal
                    </v-btn>
                    <v-btn depressed
                           color="primary">
                        Primary
                    </v-btn>
                    <v-btn depressed
                           color="error">
                        Error
                    </v-btn>
                    <v-btn depressed
                           disabled>
                        Disabled
                    </v-btn>
                </v-row>
            </template>
        </v-main>
    </v-app>
</div>