相信很多同學(xué)都有寫日志或者博客的習(xí)慣佳窑，如果不涉及數(shù)據(jù)庫和服務(wù)器等相關(guān)技術(shù)制恍，就是只有一些前端的靜態(tài)文件。
如果我們沒有自己的服務(wù)器神凑，就可以直接部署到GitHub上净神。
下面是部署詳細(xì)步驟
1.GitHub 項(xiàng)目
確保有一個(gè)GitHub倉庫何吝，相關(guān)操作不作討論
比如倉庫名稱是：MyGithubAppPage
2.克隆到本地
git clone https://github.com/你的用戶名/MyGithubAppPage.git
然后安裝相關(guān)依賴
yarn
3.安裝插件 gh-pages
克隆到本地后，進(jìn)入到項(xiàng)目目錄鹃唯，執(zhí)行下面命令下載安裝
yarn add gh-pages -D
4.修改配置
- package.json
+"homepage": "https://你的用戶名.github.io/MyGithubAppPage",
"scripts": {
+ "docs:deploy": "gh-pages -d dist" // dist是打包生成的目錄
}
- webpack.config.js
這里以為webpack.config.js配置文件為例
build: {
...,
assetsPublicPath: '/MyGithubAppPage/' // 項(xiàng)目名稱
},
5.推送
先打包生成dist目錄爱榕，然后執(zhí)行推送命令
npm run docs:deploy
6.Github的source分支
進(jìn)入GitHub項(xiàng)目，找到settings的GitHub Pages選項(xiàng)坡慌，把source改為gh-pages(上面命令會(huì)自動(dòng)生成該分支)
7.訪問
在瀏覽器地址欄輸入https://你的用戶名.github.io/MyGithubAppPage/
題外
這個(gè)項(xiàng)目是使用umi的文檔工具Dumi開發(fā)生成的黔酥，雖然個(gè)人覺得對(duì)新手不是很友好，約定式帶來的靈活相反可能會(huì)隱藏對(duì)應(yīng)的配置理解洪橘，但是總的來說還是很不錯(cuò)的跪者。
下面貼一下關(guān)鍵配置
項(xiàng)目也是放在Github上，可以克隆下來熄求，相信不管對(duì)項(xiàng)目部署還是開發(fā)周邊都有會(huì)有一定的幫助：
項(xiàng)目地址：https://github.com/haoyinag/AngsiUUI
博客地址：https://haoyinag.github.io/AngsiUUI/
自動(dòng)部署
由于參考dumi的自動(dòng)部署配置沒有成功渣玲，所以建議參考這篇文章gh-pages自動(dòng)部署
更多可以參考文章
