GitHub Demo 地址

在线预览

vue前端项目写好之后，想部署到线上通过在线地址进行访问，可以通过gitee或者GitHub的pages

准备工作：

• 1、要有个vue的项目(web的项目都可以)
• 2、在gitee或者GitHub建立项目(这里是通过GitHub展示的)

vue项目设置并打包

在vue.config.js文件设置publicPath为./

在这里插入图片描述

运行打包命令 npm run build:prod生成dist包

在这里插入图片描述

添加gh-pages分支

新增一个代码分支，命名为gh-pages，如果不是空白分支，把分支多余的代码删掉
然后复制dist里面的文件（不要dist文件夹）到项目根目录
提交代码到分支

设置pages

进入GitHub-项目-settings-pages设置，即可得到在线预览地址

在这里插入图片描述

效果

在线预览

在这里插入图片描述