'vuetify'에 해당되는 글 2건

[사용 환경]

  - Vue-Cil 로 Vue, Vuetify 설치

  - WebPack 미 설치

1. babel polyfill설치

 node cmd > $npm install --save @babel/polyfill

2. 프로젝트 폴더 > src > main.js에 구문 추가

 import '@babel/polyfill';

3. 프로젝트 폴더 > babel.config.js 파일 생성

module.exports = {

  presets: [

    [

      '@vue/app',

      {

        "useBuiltIns": "entry"

      }

    ]

  ]

}

4. 프로젝트 폴더 > .babelrc 파일 생성

{

    "presets": [

        "@babel/preset-env"

    ]

}

5. 프로젝트 폴더 > vue.config.js에 구문 추가

  const ansiRegx = requeire('ansi-regex')

  module.exports = {

    ..

    transpileDependencies: [ansiRegex]

    ..

  }

6. .vue에 babel-polyfill CDN 추가

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.26.0/polyfill.min.js"></script>

#. 참고 사이트

https://steemit.com/vue-cli3/@stepanowon/vue-cli-3-x-ie11

[Spring boot 설정]
- https://ingus26.tistory.com/28

1. node를 설치한다.

  나는 Windows Installer (.msi) 64bit버전의 node를 설치했다. 

 -  https://nodejs.org/ko/

- node command prompt에서 node를 입력하면 설치된 버전을 확인할 수 있다.

2. node command prompt에서 vue를 설치해보자!

  1) cd "spring boot 프로젝트 root폴더" 경로로 이동 한다.

  2) vue-cli

  vue-cli 4 업데이트 후.. vuetify add가 안되서.. 확인해보니 ㅠㅠ

  이전 vue-cli를 완전히 삭제하지 않고 업데이트와 재설치를 병행해서 그랬다.

  vue-cli를 삭제하고 vue --version 해서 명령어가 실행되지 않으면 말끔히 지워진 것.

     (1) 삭제

      $ npm r -g vue-cli   

      $ npm r -g @vue/cli 

     (2) 재설치

      $ npm i -g @vue/cli

     (3) 프로젝트 생성

      $ vue create 프로젝트명

      설치 완료시 http://localhost:8080/를 접속하여 페이지를 확인한다.

  3) vuetify 설치

    $ vue add vuetify

         vue와 vuetify가 설치됬습니다 :D

 - 끗 -