gitup 上不仅可以托管我们的代码，也可以部署代码哦，具体的流程往下看
先上几个例子：
代码不会上传到gitup的请移交 这里
vue 代码history 和 hash 部署区别 请转移 这里
部署vue项目
vue项目的部署方式和路由的选择有很大的关系，hash 和 history 的选择，与他的部署方式也不一样。
vue2 的hash 模式
方式一： (使用多个分支) 网上的同学大部分都说源代码是master分支，而部署的是另一个分支（就是将vue打包的结果放另一个分支），好处是，每个分支做每个分支的事情，这样分开也挺好的。
方式二： 由于gitup上的 gitup page上是先选择分支，然后选择 root还是 docs 可以把打包的dist 重命名为 docs 这样也可以实现
第一步
代码打包后需要区分线上环境，那么项目的根路径需要使用 你项目的名称，例如：vue2举例:
在vue的配置文件中，如果是webpack搭建的话，那么在webpack.config.js中配置,如果是vue-cli脚手架搭建的话，那么在 vue.config.js 中使用下面的配置 publicPath: './'
const path = require('path'); module.exports = { // 这一步很关键,注意是 './' publicPath: process.env.NODE_ENV === "production" ? "./" : "/", // 相对于打包路径index.html的路径 indexPath: 'index.html', // 'dist', 生产环境构建文件的目录 outputDir: 'docs', // 相对于outputDir的静态资源(js、css、img、fonts)目录 assetsDir: 'static', }
第二步
在packge.json 这个文件中，加入"homepage":"./"' 这一行代码放入在package.json的主目录下面，如：
第三步
上床代码到gitup上面完成后，点击 setting 找到 ``github Pages`, 设置成
效果
有的人会说，怎么地址栏上不带 # 号，没错，这个是 vue2的history模式的图，我在hash 模式上的测试后的图片被我删除了，只保证方法能用
vue2 history 模式
流程和vue2hash模式类似，只是有部分地方需要修改，修改的地方如下：
第一步
将publicPath 里面的'./'改成你的/项目名称/,如：
第二步 和 vue2hash 的相同，设置主页为 ‘./’
第三步 和 vue2 hash 的也可以相同，
第四步
设置完前面3步，我们会发现点击地址还是 404,对的，你没有看错，还是404.
解决办法： 由于gitup会自动定位到404.html页面，所以我们把index.html的内容，拷贝一份到新建一个404.html文件。如：
接下来点解地址就可以打开里面的资源了。
vue3 项目
对于vue3这里，其实个人感觉都是一样的。但是与vue2里面也有点小差距
我们都知道，vue3项目中的路由方也是两种，一种地址栏上带#号的，一种不带，这里讨论不带# 号的history模式， 带#号的自己去探索哈， 这里讨论的是 vite创建的项目， 如何创建vue3项目
第一步
同样的道理，把公共的路径设计为相对路径， 在vite.config.js 中添加（没有的自己新建）base：’/项目名称/‘,项目名称是指gitup上面的名称，如：
第二步 和 vue2hash 一样，package.json 设置主页为相对路径
第三步 和vue2hash的第三步也是一样的
通过上面三部就可以展示了哦：（这里不需要设置404.html哦）
效果：
react
懂了vue的部署，react的部署更加简单，貌似我的文章应该重react开始的，哈哈。
第一步
不需要设置basePath? 这里我需要打问好，因为我还没有学习到react 中的路由，所以不能误人子弟。我展示我部署的第一步， 设置package.json里面的`“homepage”:"./"
第二步
将打包的名族改成docs,然后放到gitup上就行，最后和vue设置分支自动生成地址就好了。
效果
