# VuePress μ‚¬μ΄νŠΈ λ°°ν¬ν•˜κΈ° 절차

VuePress둜 κ·Έλ‚  κ·Έλ‚  배운 λ‚΄μš©μ„ μ •λ¦¬ν•˜κΈ° μœ„ν•΄ ν•™μŠ΅ λ…ΈνŠΈ μ‚¬μ΄νŠΈλ₯Ό μ œμž‘ν•©λ‹ˆλ‹€.

# μ‚¬μ΄νŠΈ 배포 ν•˜κΈ° 절차

  1. κΉƒν—™ (opens new window) 계정 생성
  2. κΉƒν—™ 리포지토리 생성
  3. μƒμ„±ν•œ 리포지토리λ₯Ό 클둠
# ν•™μŠ΅ λ…ΈνŠΈλ₯Ό 관리할 ν΄λ”μ˜ μœ„μΉ˜μ—μ„œ μ•„λž˜ λͺ…λ Ήμ–΄ μž…λ ₯
git clone 'μƒμ„±ν•œ 리포지토리 클둠 μ£Όμ†Œ'
  1. 클둠된 ν”„λ‘œμ νŠΈ μœ„μΉ˜λ‘œ 이동
cd 'ν΄λ‘ ν•΄μ„œ μƒμ„±λœ 폴더 이름'
  1. ν”„λ‘œμ νŠΈμ—μ„œ docs 폴더 생성
  2. ν”„λ‘œμ νŠΈμ—μ„œ μ•„λž˜μ™€ 같은 λͺ…λ Ήμ–΄λ₯Ό μˆœμ„œλŒ€λ‘œ μž…λ ₯
npm init -y
npm install -D vuepress

TIP

λ§Œμ•½ permission κ΄€λ ¨λœ 였λ₯˜κ°€ λ‚  κ²½μš°μ—λŠ” npm install -D vuepress λŒ€μ‹ μ— sudo npm install -D vuepress μž…λ ₯ν•˜μ„Έμš”.

  1. package.json 파일의 λ‚΄μš©μ„ μ•„λž˜μ™€ 같이 μˆ˜μ •
{
  ...
  "scripts": {
    "doc": "vuepress dev docs",
    "build": "vuepress build docs"
  },
  ...
}
  1. docs 폴더 밑에 README.md νŒŒμΌμ„ μƒμ„±ν•˜κ³  μ•„λž˜μ˜ λ‚΄μš©μ„ μΆ”κ°€
# Vue.js 정볡 μΊ ν”„ ν•™μŠ΅ λ…ΈνŠΈ!!
  1. 클둠된 ν”„λ‘œμ νŠΈ 폴더 밑에 deploy.sh νŒŒμΌμ„ μΆ”κ°€ν•˜κ³  μ•„λž˜ λ‚΄μš© μ‚½μž…
#!/usr/bin/env sh

# abort on errors
set -e

# build
npm run build

# navigate into the build output directory
cd docs/.vuepress/dist

# if you are deploying to a custom domain
# echo 'www.example.com' > CNAME

git init
git add -A
git commit -m 'deploy with vuepress'

# if you are deploying to https://<USERNAME>.github.io
# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git master

# if you are deploying to https://<USERNAME>.github.io/<REPO>
git push -f <λ·° ν”„λ ˆμŠ€λ₯Ό μœ„ν•΄ μƒμ„±ν•œ κΉƒν—™ λ¦¬ν¬μ§€ν† λ¦¬μ˜ 클둠 μ£Όμ†Œ> master:gh-pages

cd -

DANGER

μœ„μ—μ„œ <λ·° ν”„λ ˆμŠ€λ₯Ό μœ„ν•΄ μƒμ„±ν•œ κΉƒν—™ λ¦¬ν¬μ§€ν† λ¦¬μ˜ 클둠 μ£Όμ†Œ>λŠ” κΌ­ λ¦¬ν¬μ§€ν† λ¦¬μ˜ μ£Όμ†Œλ‘œ λ³€κ²½ν•΄μ£Όμ…”μ•Ό ν•©λ‹ˆλ‹€.

  1. ν”„λ‘œμ νŠΈ ν΄λ”μ˜ μœ„μΉ˜μ—μ„œ sh deploy.shλ₯Ό μ‹€ν–‰ν•˜μ—¬ μ‚¬μ΄νŠΈ 배포

TIP

shλΌλŠ” λͺ…λ Ήμ–΄λŠ” μœˆλ„μš° κΈ°λ³Έ λͺ…λ Ήμ–΄ ν”„λ‘¬ν”„νŠΈ μ°½μ—μ„œ 먹지 μ•ŠμŠ΅λ‹ˆλ‹€. λ”°λΌμ„œ cmder (opens new window)μ΄λΌλŠ” μ½˜μ†” ν”„λ‘œκ·Έλž¨μ„ μ„€μΉ˜ν•΄μ„œ μ‹€ν–‰ν•˜κ±°λ‚˜ git bash와 같은 λ³„λ„μ˜ μ½˜μ†”μ°½μ„ μ‚¬μš©ν•˜μ‹œλ©΄ λ©λ‹ˆλ‹€ πŸ˜ƒ

  1. λΈŒλΌμš°μ €μ— https://<USERNAME>.github.io/<REPO> μž…λ ₯ ν›„ μ‚¬μ΄νŠΈ 확인 (보톡 5~10λΆ„ μ†Œμš”)