(可參考代碼地址https://github.com/xiaoyaoyimei/my-app)主要是參考app.js中history配置和package.json。
在你的項(xiàng)目可以yarn build的基礎(chǔ)下
1.安裝cnpm install gh-pages(建議使用cnpm--yarn安裝有點(diǎn)問題)
2.配置package.json內(nèi)容中的scripts中添加一行配置
"gh-pages": "react-scripts build && gh-pages -d build"
若有配置過antd中的react-app-rewired，則直接配置
? "gh-pages": "react-app-rewired build && gh-pages -d build"
整體如下
"scripts": {
? ? "start": "react-scripts start",
? ? "build": "react-scripts build",
? ? "test": "react-scripts test",
? ? "eject": "react-scripts eject",
? ? ? "gh-pages": "react-scripts build && gh-pages -d build"
? },
3.除此之外在package.json配置"homepage":"/my-app",此處跟你的倉庫名保持一致即可。（超級(jí)重要）若不配置默認(rèn)的就是你直接放在根目錄下的地址。發(fā)布到github中會(huì)因?yàn)榈刂啡鄙賯}庫名所有鏈接都報(bào)錯(cuò)。
跟此處相匹配的配置是在App.js中配置導(dǎo)入import createHistory from 'history/createHashHistory'
const history = createHistory({
? ? basename: homepage
? })
<Router history={history}>...</Router >
每次發(fā)布運(yùn)行yarn gh-page即可
另一個(gè)注意點(diǎn)是請求的時(shí)候：
axios.get('/api/home.json')注意去掉api之前的/改成axios.get('api/home.json')。
強(qiáng)烈不建議使用(當(dāng)然也有可能是我git不熟悉)
yarn build
git checkout -b gh-pages
git add -f build
git commit -m 'create project'
git subtree push --prefix build origin gh-pages
這樣發(fā)布以后，如果想再次發(fā)布，真的是個(gè)坑。
因?yàn)槟悻F(xiàn)在在gh-pages分支了，（若直接git add .）很容易將master的分支提交。而且在切換分支的來回過程中代碼極容易將不同分支代碼搞混。
若想再次提交我的做法是強(qiáng)制切換分支git checkout master -f
刪除分支 git branch -D gh-pages
刪除遠(yuǎn)程分支 git push origin --delete gh-pages
然后再繼續(xù)上面的指令。
