github使用gh-pages部署静态站点

377 阅读1分钟

前言

当我们想把自己的网站部署到一个静态网站上,Github Pages是一个很好的选择(稳定、可靠、不花钱)。下面是一个基于vue3+vite的项目的部署流程。

假设你已经有一个项目并且已经发布到github上了,先把项目git clone到本地。

1、安装gh-pages

pnpm i -D gh-pages

image.png 2、初始化仓库,提交代码到远程仓库

image.png

image.png

3、在package.json文件中添加script脚本

"deploy":"gh-pages -d dist -r https://github.com/Rowe9/Rowe-Admin-System.git -b gh-pages",

image.png 4、在终端运行命令

pnpm run build
pnpm run deploy

会出现一个dist文件夹

image.png

5、打开github仓库,点击setting-->pages-->选择gh-pages分支的root-->点击Save

image.png

image.png 6、点击链接就可以访问啦!

image.png