之前也搭建了多次個人博客。有自己寫前后端的彤钟,有使用Ghost搭建后自己改主題的羞秤。這些都需要自己有服務器缸托,學生時買云服務器非常便宜,現(xiàn)在買服務器還是有點小貴瘾蛋,所以最近又重新?lián)v騰了個靜態(tài)博客俐镐。
工具 【VuePress】 vue 驅動的靜態(tài)網(wǎng)站生成器
具體使用方法官方文檔講得非常清楚,這里就不贅述了瘦黑。文檔肯定是要看的京革,不然寫都不知道怎么寫
主題
官方的主題不能滿足我的需求,嘿嘿幸斥!找了個vuepress-theme-reco一款簡潔而優(yōu)雅的 博客 & 文檔 主題匹摇。
上線
國內(nèi)使用github始終是速度慢啊,我用的是碼云甲葬。注意了這里要想直接使用wangshiting.gitee.io
這樣直接訪問你的博客廊勃,需要你創(chuàng)建的倉庫名與你的用戶名相同。創(chuàng)建好倉庫后经窖,將構建后的dist里的文件推送到這個倉庫坡垫,在碼云的》服務》Gitee Pages開啟,這樣就可以訪問你的博客啦画侣。
走一遍詳細流程
mkdir blog #新建文件夾
cd blog\
# 初始化package.json可以一直回車
npm init
# 安裝vuepress
npm i vuepress -D
# 安裝主題
npm i vuepress-theme-reco -D
# 在package.json的scripts中加入
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs",
# 在根目錄下建一個README.md文件冰悠,這里就是你的主頁內(nèi)容
# 在根目錄下創(chuàng)建一個docs文件夾
# docs下創(chuàng)建一個.vuepress文件夾
# .vuepress下建一個config.js,這就是配置文件
# 使用主題
// .vuepress/config.js
module.exports = {
theme: 'reco'
}
# 本地預覽
npm run docs:dev
# 生成靜態(tài)文件 會生成一個dist文件夾,在.vuepress下
npm run docs:build
# 然后就可以推送到碼云上線了配乱。