10 프로젝트 배포하기

source: categories/study/vue-project/vue-project_9-01.md

10 프로젝트 배포하기

  • 이번 챕터에서는 개발된 Vue 프로젝트를 운영 환경으로 배포하기 위한 배포 파일을 생성하는 방법에 대해서 알아봅니다.

10.1 프로젝트 빌드(build) 하기

  • 터미널에서 다음 명령어를 실행해서 배포 파일을 생성합니다.

npm run build

  • 명령어를 실행하면 다음과 같이 프로젝트 배포를 위한 파일이 프로젝트 루트 디렉토리의 dist 폴더에 생성됩니다.

  • 생성된 dist 폴더를 보면 css, img, js 폴더와 index.html이 생성된 것을 확인할 수 있습니다.

  • js 폴더를 열어보면 우리가 작성한 모든 js 파일과 vue 컴포넌트 파일에 해당하는 js 파일이 생성된 것을 확인할 수 있습니다.

  • 서비스를 운영하고자 하는 호스팅 서버에 dist 폴더의 파일을 업로드해서 서비스를 구동하면 됩니다.
  • index.html 파일이 Vue 프로젝트 실행 파일이 됩니다.