使用hexo搭建個人博客並部署在github

1 環境配置

1.1 安裝node.js和git

node.js在mac下直接下載dmg文件安裝即可

git在mac下通過brew安裝

1.2 安裝cnpm

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

加快npm的速度

1.3 bug

在初次使用npm時會遇到文件夾權限問題

npm install -g hexo-cli

npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules

官方給出的解決方案之一是改變npm默認文件夾的位置

參考鏈接

## Manually change npm’s default directory§](https://docs.npmjs.com/resolving-eacces-permissions-errors-when-installing-packages-globally#manually-change-npms-default-directory)
  1. 創建新的文件夾

mkdir ~/.npm-global

  1. 設置npm的默認文件夾位置

  2. npm config set prefix '~/.npm-global'

  3. 在zshrc中設置環境變量

vim ~/.zshrc
export PATH=~/.npm-global/bin:$PATH
  1. 重新加載環境變量

source ~/.profile

2 在本地建立hexo站點

  • 使用npm安裝hexo

cnpm install -g hexo-cli

建立文件夾存放博客的文件夾,並在此文件夾下初始化hexo站點

mkdir blog
cd blog
hexo init

執行成功後會出現以下信息

INFO  Start blogging with Hexo!
  • 創建博客

hexo n "first blog"

等價於hexo new "first blog"

  • 清理hexo緩存文件和已生成的靜態文件

hexo clean

  • 生成靜態文件

hexo g

等價於hexo generate

  • 啓動hexo服務起
    hexo s
    等價於hexo server
  • 本地參看
    默認情況下,訪問網址爲: http://localhost:4000/

3部署到github

  • 安裝插件
    cnpm install --save hexo-deployer-git

  • 創建github倉庫

    倉庫名必須是github用戶名.github.io

  • 配置_config.yml文件
    open -t _config.yml

    配置前

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: ''

添加type repo branch信息

配置後

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: https://github.com/mengdong824/mengdong824.github.io.git
branch: master
  • 部署在github

hexo d 等價於hexo deploy

4 更換主題

更換next主題

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

在_config.yml文件中修改theme名爲next

  # Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next

5 優化主題

添加評論系統,閱讀量統計等。
參考:

http://theme-next.iissnan.com/getting-started.html#theme-settings

http://jeffyang.top/Hexo/Hexo%E4%B8%BB%E9%A2%98Next%E7%BE%8E%E5%8C%96/

https://www.jianshu.com/p/f054333ac9e6

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章