11.23 使用GitHub搭載個人博客就是這麼簡單

安裝nodejs環境

這個直接搜索安裝即可,安裝完成之後,通過如下命令檢測環境變量是否安裝成功:

λ node -v
# 輸出版本號
v12.13.1

正確輸入版本號即可。

安裝cnpm

cnpm是淘寶鏡像,可以加快依賴的安裝速度

npm install cnpm -g --registry=https://registry.npm.taobao.org

# 輸出
C:\\Users\\\\xxxxx\\AppData\\Roaming\\npm\\cnpm -> C:\\Users\\\\xxxxx\\AppData\\Roaming\\npm\\node_modules\\cnpm\\bin\\cnpm
+ [email protected]
added 680 packages from 933 contributors in 24.882s

其他

Git、GitHub就不多說了

安裝 Hexo

cnpm install -g hexo-cli

可以通過如下命令檢查是否安裝成功

λ hexo -v

"node" "C:\\Users\\\\xxxxxx\\AppData\\Roaming\\npm\\\\node_modules\\hexo-cli\\bin\\hexo" -v
hexo-cli: 3.1.0
os: Windows_NT 10.0.18362 win32 x64
node: 12.13.1

v8: 7.7.299.13-node.16
uv: 1.33.1
zlib: 1.2.11
brotli: 1.0.7
ares: 1.15.0
modules: 72
nghttp2: 1.39.2
napi: 5
llhttp: 1.1.4
http_parser: 2.8.0
openssl: 1.1.1d
cldr: 35.1
icu: 64.2
tz: 2019c
unicode: 12.1

創建本地博客

hexo init gitpage

出現下面提示表示初始化成功了

使用GitHub搭載個人博客就是這麼簡單

執行完之後目錄內容

使用GitHub搭載個人博客就是這麼簡單

進入gitpage目錄,執行如下命令

cd gitpage
cnpm install

這樣,hexo就安裝完成了。

Hexo 基本用法

啟動

hexo server 
# or
hexo s
使用GitHub搭載個人博客就是這麼簡單

通過瀏覽器訪問http://localhost:4000即可查看效果:

使用GitHub搭載個人博客就是這麼簡單

新建博客

hexo new "My First Post"

在source_posts 路徑下,會有一個 My-First-Post.md 的文件。 編輯這個文件,然後保存。

回到命令行,輸入

hexo g 

創建靜態文件

啟動服務器,查看效果

hexo server

啟動之後,即可看到自己新創建的這篇文章。

部署到GitHub

首先在GitHub創建一個倉庫,倉庫名叫"<username>.github.io"。複製倉庫地址。打開gitpage目錄下的_config.yml 文件, 找到 #Deployment,填入以下內容:/<username>

deploy: 
type: git
repository: https://github.com/Happy4Java/happy4java.github.io.git
branch: master

保存,然後在命令行執行如下語句:

cnpm install hexo-deployer-git --save

執行完之後,即可執行部署命令:

hexo d

可能需要輸入github的賬號密碼,輸入之後即可部署完成。

查看效果

訪問https://happy4java.github.io即可查看到效果。

使用GitHub搭載個人博客就是這麼簡單

使用 Next 主題

進入gitpage文件夾下的themes文件夾,執行

git clone https://github.com/theme-next/hexo-theme-next.git

這樣,該主題的文件就全部克隆到 gitpage\\themes\\next 下面。

修改博客配置文件

  • 打開 _config.yml配置文件
  • 找到 theme:
  • 把 Hexo 默認的 lanscape 修改成 hexo-theme-next 。
  • 找到 # Site,添加博客名稱,作者名字等。
  • 在 language 後面填入 en 或者 zh-CN,選擇英文或者中文。
  • 找到 # URL, 填入 url。比如 url: https://happy4java.github.io

重新生成部署

hexo g
hexo d

訪問https://happy4java.github.io即可查看效果

使用GitHub搭載個人博客就是這麼簡單


分享到:


相關文章: