기존 Vue.js 프로젝트 GitHub 연동 및 GitHub Page 연동

기존 Vue.js 프로젝트 GitHub 연동 및 GitHub Page 연동

1. 프로젝트를 GitHub repository에 연동

1) GitHub Desktop 설치

https://desktop.github.com/

2)GitHub Desktop 실행 > File > Add local repository

프로젝트 폴더를 새로 생성한 repository 의 대상 디렉토리로 지정

Git repository로 지정된 폴더가 아니라면 아래와 같은 화면에서 "create a repository" 선택

publish repository 실행

3) vue.config.js 생성 및 프로젝트 build

module.exports = {
  ...,
  publicPath: "/[GitHub에 등록할 Repository명]/", //일반적으로 프로젝트명과 동일하게
  outputDir: "./docs", // 프로젝트를 build하면 docs 라는 폴더에 빌드된 파일이 생성됨
};

[프로젝트폴더]/docs 폴더에 빌드된 파일이 생성되었는지 확인

4) GitHub Desktop > Commit to main 및 push origin 실행

5) GitHub web page > Settings > Pages > Source 을 아래와 같이 설정 > Save

댓글