github 我的博客搭建

時間 2020-07-17

標籤 github 我的博客搭建欄目 Git 简体版

原文原文鏈接

github 我的博客搭建

系統環境配置：

要使用Hexo，須要在你的系統中支持Nodejs以及Git，若是尚未，那就開始安裝吧！html

1.安裝 node.js
下載地址 node.js
直接雙擊下載下來的msi文件，一路下一步就ok了，安裝完以後調出命令行或者node命令輸入終端，輸入node -v看到版本信息就代表安裝成功了。若是不會就參考node.js安裝
2.安裝 git
下載地址 git下載
直接雙擊下載下來的git安裝程序，同node安裝，安裝完以後右鍵發現多了兩個Git GUI Here 、Git Bash Here，點擊後者，而後輸入git --version出現版本信息就代表安裝成功了。
3.註冊 github帳號
github 官網 github

git 鏈接github配置：

配置SSH key：

爲何要配置這個呢？由於你提交代碼確定要擁有你的github權限才能夠，可是直接使用用戶名和密碼太不安全了，因此咱們使用ssh key來解決本地和服務器的鏈接問題。node

#檢查本機已存在的ssh密鑰
$ cd ~/. ssh

若是提示：No such file or directory 說明你是第一次使用git。git

#生成 ssh key
ssh-keygen -t rsa -C "郵件地址"

而後連續3次回車，最終會生成一個文件在用戶目錄下，打開用戶目錄，找到.ssh\id_rsa.pub文件，記事本打開並複製裏面的內容，打開你的github主頁，進入我的設置 -> SSH and GPG keys -> New SSH key：

將剛複製的內容粘貼到key那裏，title隨便填，保存。github

測試是否成功：

$ ssh -T git@github.com  # 注意郵箱地址不用改

若是提示Are you sure you want to continue connecting (yes/no)?，輸入yes，而後會看到：shell

Hi liuxianan! You've successfully authenticated, but GitHub does not provide shell access.

看到這個信息說明SSH已配置成功！如圖所示：
express

此時你還須要配置：npm

$ git config --global user.name "hadoopBeginner" #你的github用戶名，非暱稱
$ git config --global user.email "xxx@qq.com" #填寫你的github註冊郵箱

搭建我的博客

安裝 hexo：

1. 安裝淘寶源的cnpm
選裝cnpm。因爲npm速度有時候使人堪憂，因此建議安裝淘寶源的cnpm，在git bash中輸入下面整段
```
alias cnpm="npm --registry=https://registry.npm.taobao.org \
--cache=$HOME/.npm/.cache/cnpm \
--disturl=https://npm.taobao.org/dist \
--userconfig=$HOME/.cnpmrc"
```
安裝完以後驗證，輸入：cnpm info express,若出現一大堆信息則代表成功了。api
2. 安裝 hexo 命令緩存
```
$ cnpm install -g hexo
```
在這裏會有一段時間等待，請稍等安全
3. 安裝我的博客
進入到你本地的博客存放路徑，例如 F:\hexo\blog
```
# 進入本地博客存放目錄
$ cd f:
$ cd hexo/blog/
# 初始化 我的博客
$ hexo init #等待一段時間
```
初始化完成之後，會生成如下目錄：
```
$ hexo g
生成靜態網頁
$ hexo s
執行完之後，你就能夠去打開 http://localhost:4000/  看本地版的博客效果了。
```
修改主題：

我的比較喜歡 next 這款主題。基本呢就是這個效果我的博客

下載主題：
```
$ hexo clean
$ git clone https://github.com/iissnan/hexo-theme-next.git themes/next
```
啓動主題：

1. 修改Hexo目錄下的_config.yml配置文件中的theme屬性，將其設置爲next
1)請確保您使用的是Hexo 3（或以上）
2)next.yml在站點的source/_data目錄中建立一個名爲（建立_data目錄，若是它不存在）
3)複製不管是在網站的下一個主題選擇_config.yml和主題的_config.yml進入next.yml。
4)使用--config source/_data/next.yml參數啓動服務器，生成或部署。
5)例如：hexo clean --config source/_data/next.yml && hexo g --config source/_data/next.yml

2.生成靜態頁面

hexo clean --config source/_data/next.yml && hexo g --config source/_data/next.yml
#本地 預覽
hexo s

錯誤：找不到模塊'hexo-util' 問題，請檢查您的NPM版本。

1)仍然沒有工做。請刪除node_modules目錄並從新安裝使用cnpm install。
2)請hexo-util明確經過cnpm install --save-dev hexo-util您的網站包裝代碼。

部署到GitHub上：

修改站點目錄的 _config.yml 文件，在最後添加

deploy:
  type: git
  repo: git@github.com:hadoopBeginner/hadoopbxxxxxxxxxxx #這裏填你本身的github地址
  branch: master

而後在命令行中執行

#提交到github
$ hexo d
#注意須要提早安裝一個擴展：
$ cnpm install hexo-deployer-git --save

到此呢，你的博客基本就搭建完畢了。

博客外部插件：

這個是我的博客的第三方插件，一個博客搜索插件，一個評論插件。

搜索插件 algolia：

1) 註冊帳號 algolia
2) 登錄，進去建立一個索引，如圖：
3) 建立一個api key，並賦予增刪的權限，如圖所示：

並賦予 add records,delete recourds,list indices,delete index 4個權限，如圖所示：
4) 而後編輯配置文件，首先是 next 目錄下的 _config.yml：
```
將 # Algolia Search 下的
algolia_search:
enable: true  ---改成true
```

5) 而後修改站點目錄下的 _config.yml：
最後增長：

#站內搜索：
algolia:
applicationID: 'ZMNZVONxxx'   #Application ID 對應的值
apiKey: 'a3b6cc86714b99e25e614968b07xxxxx'   # 這裏填你新建的 api key 對應的值
indexName: 'bigDataBeginner'  #這裏填你  建立的索引名稱
chunkSize: 5000    #這個值不動

6) 執行命令，將文章列表同步到 algolia：

$ export HEXO_ALGOLIA_INDEXING_KEY=a3b6cc86714b99e25e614968b073f442   # key值對於你新建 api key的值
$ hexo algolia

若是報錯執行 hexo clean 後，重試。而後預覽。

評論插件來必力：

1) 註冊帳號來必力
2) 登錄，綁定本身博客地址。如圖所示：
3) 複製本身地址對應的id值。如圖所示：
4) 編輯 next 目錄下的 _config.yml 配置文件：
修改下面一行：
```
livere_uid: "MTAyMC8zMjg2xxxxxx"  ---這裏填入你複製的id值
```
清空緩存，從新生成靜態頁面預覽就看到效果了。

Hexo經常使用命令：

$ hexo clean 清除本地緩存
$ hexo g # 或者hexo generate，生成靜態頁面
$ hexo s # 或者hexo server，能夠在http://localhost:4000/ 查看
$ hexo new "postName" #新建文章
$ hexo new page "pageName" #新建頁面
$ hexo d  # 代碼同步到github上

好了，本文到此結束。你博客搭建好了嗎?