如何在Github中预览你的React项目

1. 利用官方脚手架create-react-app来创建你的项目

npx create-react-app my-app

2. 敲代码，做出你的牛逼项目。

3. 在package.json中添加一行配置

 "private": true,
 "homepage": "https://yourname.github.io/my-app", // 添加这一行

//'my-app '是你的项目名称，'yourname'对应你的github用户名
//homepage不配置的话或者配置有误，访问链接的时候就会报错404

4. 打包

npm run build
// 打包完成之后会生成一个build文件夹，里面都是静态资源

5. 我们在github上面新建一个远程仓库，名字也叫my-app
   记录远程仓库的地址（eg: git@github.com:kuanglinfeng/my-app.git)

6. 把项目传到GitHub上去

git add .
git commit -m '一些描述'
git remote add origin git@github.com:kuanglinfeng/my-app.git(之前我们保存的地址)
// 一般提代码之前我们都应该先拉下代码，避免冲突
git pull origin master
git push origin master
// 成功之后代码就会提交到master上面去，此时仓库中有相应的代码

7. 在github展示的是静态的html文件，我们上传的react项目是不能预览的，此时我们可以把打包好的build文件夹上传到另一个分支

git subtree push --prefix=build origin gh-pages

8.执行7操作之后，仓库多了个gh-pages分支

9. 进入仓库，点击Setting,找到GitHub Pages这一块，修改Source选择刚刚的gh-pages，然后保存

gitpage.png

然后点击2，链接就会跳转到你的项目啦。

10. 现在通过这个链接别人就可访问你的项目了。

全文参考：
https://www.jianshu.com/p/813625179180