github在线预览

作为一个开发人员应该都往github上托管了或多或少的项目，那问题来了，难道GitHub上只能看代码吗？我想直接查看demo的效果怎么办？OK，往下看就知道怎么办了。

首先我们需要关联远程仓库，如果不了解的可以查看一下廖雪峰老师的git教程，这里和我们以前提交代码相同，这时我们的远程仓库会有一个master分支

这里需要提到.gitigonore ，大家都知道我们提交代码时有很多文件是需要忽略掉的，例如node_nodules、dist等。但是在线预览其实就是部署一下打包后的dist文件。那么怎么将以忽略的文件提交到远程呢？

//创建新分支
git checkout -b gh-pages

//将打包后的引入路径改为绝对路径

//1、Vue-cli2  修改 config/index.js   
assetsPublicPath :'./'

//2、Vue-cli3 修改 Vue.config.js   
baseUrl :'./'  或者 publicPath :'./'

//打包文件生成dist
npm run build

//提交代码到暂存区
git add .
git add -f dist/
git commit -m "在线预览"

//创建远程分支
git push --set-upstream origin gh-pages
//只讲dist文件提交到远程gh-pages
git subtree push --prefix dist origin gh-pages 

点解设置 settings

一直往下翻，找到github pages，按图选择这时会有一个链接，如果还没没有自己的userName.github.io地址,
可以去第一次搭建个人博客

这时点击链接，就可以看到我们在线预览的效果了。