vue-cli 및 typescript 설정

@vue-cli

- 터미널에 npm install -g @vue/cli 라고 치면 설치.

 

- 설치 완료후 프로젝트 생성은  vue create myproj 라고 타이핑 후 프로젝트 설치 후

아래와 같은 코멘트가 나오면 걍 default선택
? Please pick a preset:
default (babel, eslint)

 

- package.json 에 있는 대로 터미털에

npm run serve 실행하면  http://localhost:8080/ 이 기본 로컬 주소로 설정되고

해당 주소 이동하면 아래와 같은 화면을 볼 수 있다.

vue-cli 3.x버전에서는 프로젝트 생성시

즉 vue create <프로젝트명> 하고 나면 typescript 설치 항목이 나온다.

 

- webpack 도 노출 되어 있지 않기에 컨트롤 하려면 별도의 vue.config.js 파일을 만들면 된다.

관련 링크 : https://cli.vuejs.org/guide/webpack.html#simple-configuration

@vue/typescript

- 터미널에 vue add @vue/typescript 치면 아래와 같은 멘트가 나온다.

? Use class-style component syntax?
? Use Babel alongside TypeScript for auto-detected polyfills?

 

당근 yes로 답하면 된다.

 

설치가 다 되면 별다른 설정은 할 필요가 없다.

npm run serve 를 터미널에 치고 실행해 보면 바로 알 수 있다.