搭好架子,實現可以用鏈接訪問先。
一、安裝環境
1. 去node官網下載Node.js,安裝后回到終端。
位置:
Node.js /usr/local/bin/node
npm /usr/local/bin/npm
2. 打開「終端」,接下來需要輸入命令的的操作都在終端里輸入。
終端常用指令:
pwd #查看當前位置,啟動終端的位置一般在用戶文件夾
cd Banli/ #進入叫Banli的文件夾
cd /User/Banli/Documents #進入文稿
cd /User/Banli/Documents/123 #進入文稿里的 123文件夾
mkdir BBB #在123文件夾里創建叫BBB的文件夾
cd ../ #退到上一級
cd ../.. #推到上兩級
hexo clean #清理hexo
文件拖到終端里可以查看「在終端里用的」路徑;
?? 所有的符號都要是英文符號哦!
?? 輸入指令前用 pwd 查看當前路徑,需要始終都在博客文件夾路徑下!(如我的博客文件在 Users/Banli/blog,那我的操作始終在這個路徑下)。
3. 開放權限:
sudo su #??輸入這幾個字母,回車
Passwoed: #??輸入電腦密碼
sh-3.2# #?自動換行表示成功了。可能會顯示別的啥
權限這步要放在前面,不然會報錯。如果后面的步驟又報錯權限被拒,可以再開放下權限。
4. 檢查 node.js 是否安裝成功:
node -v #??輸入這幾個字母,回車
v10.15.3 #?顯示版本號,表示成功了
npm -v #??輸入這幾個字母,回車
6.4.1 #?顯示版本號,表示成功了
5. 通過 cnpm 安裝淘寶的鏡像(說是比直接安裝快)
npm install -g cnpm --registry=https://registry.npm.taobao.org
這時候會自動安裝(有個進度條的),安裝完了會自動換行;
6. 檢查 cnpm 是否安裝成功:
cnpm -v #??輸入這幾個字母,回車,顯示以下內容表示安裝成功
cnpm@6.0.0... #?略
7.正式安裝 Hexo
cnpm install -g hexo-cli #??輸入這幾個字母,回車
Downloading hexo-cli to....... #?顯示下載中
8.驗證
hexo -v #??輸入這幾個字母,回車
hexo-cli: 1.1.0 #?顯示版本,成功
.... #略
?? 官網說要裝 Xcode,老老實實裝了
二、搭建博客
1. 建立文件夾
pwd #??查看文件夾位置
/Users/banli #?顯示文件夾所在路徑
mkdir blog #??新建文件夾,blog是文件夾名稱,上行路徑會生成一個blog文件夾
cd blog/ #??進入blog文件夾
pwd #??檢查路徑是不是對的
/Users/banli/blog #?嗯,是對的
?? 也可以直接在文件夾里新建,一樣的。
2.用 hexo 生成博客
sudo hexo init #??輸入
INFO Cloning hexo-starter to /Users/Banli/blog #?自動克隆了個叫landscape的主題
.... #略
INFO Start blogging with Hexo! #?初始化完成
ls -l #??輸入,看一下目錄下生成了哪些東西
total 296 #?顯示生成的東西
.... #略
3. 啟動博客
hexo s #??輸入
INFO Start processing #?顯示,在本地4000端口啟動
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
在瀏覽器輸入「http://localhost:4000」即可打開博客,默認主題長??這樣。
下一步該是新建博文了,但是到這個地方出現了一次問題,輸入命令回車沒反應;??
補充:輸入命令回車沒反應是因為,要先停止預覽博客才可以繼續編輯!「Ctrl+C」停止博客。
當時不知道咋辦,就想著刪掉了重新來一遍,雖然最后也顯示了「 Start blogging with Hexo!」,但是中間還挺多「 ERRO 」的。這樣就沒法啟動了~
看到了別人用了不同的命令生成博客的,試下是可以的。刪掉文件、關掉終端(剛剛才發現不重啟路徑在垃圾桶里,不知道前面失敗的跟這個有沒有關系)。
?? 沒有重新開啟終端 / 用命令回到初始路徑,無法新建博客。因為「當前位置」會隨著被刪除得文件一起去到垃圾桶
搭建博客方法二:
用于用「sudo hexo init」指令生成博客報錯時。
1. 新建文件夾并生成博客
先進入對應文件夾。不進入指定文件夾博客文件會放在「用戶」文件夾下,像前面的方法一。我還不知道怎么進入指定文件夾,就用的默認位置:
cd /Users/Banli/Documents/ # ??進入文稿
省掉了單獨新建空文件夾的步驟,直接安裝并新建文件夾:
hexo init blog #??安裝在新文件夾「blog」里
INFO Cloning ... Start blogging with Hexo! #?顯示相同上,完成,沒有報錯
進入到「blog」文件夾:
cd blog #??進入文件夾
cnpm install #??安裝cnpm
?? 沒有進到 blog是無法運行博客的,運行「hexo s」一定會報錯。
c
2. 運行博客
hexo s #??和前面一樣
但是提示 4000 端口被使用了:
FATAL Port 4000 has been used. Try other port instead.
FATAL Something's wrong. Maybe you can find the solution here: http://hexo.io/docs/troubleshooting.html
需要換一個端口:
hexo s -p 5000 #??換成 5000 端口
INFO Start processing #?顯示成功,在本地5000端口啟動
INFO Hexo is running at http://localhost:5000 . Press Ctrl+C to stop.
瀏覽器輸入「http://localhost:5000」打開博客。
這個時候終端是無法接收指令的(方法一最后導致我重使的情況!)
「運行」博客更像是「預覽」吧,而且不是實時預覽,需要停止后才能繼續接收指令哦。
Ctrl+C #停止運行博客
停止后就看不到博客預覽了。
三、上傳到 GitHub
1. 建倉庫
登錄Github,點擊「new repositories」新建倉庫,名字輸入自己的 Github 用戶名+github.io,其他默認。
創建好后,復制??這條地址,一會兒會用到。
2. 配置
回到博客文件夾,找到 「_config.yml」文件,用代碼編輯器打開(我用的「Sublime Text」)。
找到「#URL」-「url」,改成自己的站點地址:
url: http://liubanli.github.io #??換成自己的 github 地址
翻到最末尾,找到「deploy」,類型填寫「git」并補上「repository」后面的內容:
deploy:
type: git
repository: https://github.com/liubanli/liubanli.github.io.git #??倉庫地址
branch: master #??增加
?? liubanli 是我的 Github 用戶名,改成你自己的 / 冒號后面要空格
保存。可以關閉代碼編輯器了。
3. 部署
blog的文件里要裝一個 git 的部署插件,回到終端:
cnpm install --save hexo-deployer-git #??輸入
cnpm install hexo-deployer-git --save #??順序2
順利安裝完成。提交需要依次執行下面這三個命令:
hexo clean #??清除hexo
hexo g #??「generate」的簡寫,生成
hexo d #??「deploy」的簡寫,部署
運行成功之后需要依次輸入 GitHub 的用戶名,GitHub 的密碼。
部署成功最后后會顯示:
INFO Deploy done: git #?成功
Github 上這個倉庫的頁面就有內容了。
??復制倉庫地址
??粘貼到瀏覽器地址欄,就可以訪問博客了
補充:后來我又把GitHub用戶名換了,本地預覽可以,但是傳不上 GitHub 了!!重新生成博客不行。后來全部刪除重裝,中間安裝 Hexo 的時候有提示無權限。然后也在 GitHub 添加了公鑰。
4. 添加公鑰
重新開下終端,回到默認位置
ssh-keygen -t rsa -C 你的郵箱號@sina.com #??輸入生成公鑰指令
Enter file in which to save the key (/Users/Banli/.ssh/id_rsa): #直接確定
Enter passphrase (empty for no passphrase): #??輸入電腦密碼
Enter same passphrase again: #??確認密碼
這時候會出來一串東西(不是公鑰):
Your identification has been saved in /Users/Banli/.ssh/id_rsa.
Your public key has been saved in /Users/Banli/.ssh/id_rsa.pub.
The key fingerprint is:
SHA256:4EuZ******************ig banli1001@sina.com
The key's randomart image is:
+---[RSA 2048]----+
| *******|
| ****|
+----[SHA256]-----+
提示你公鑰生成好了存在「/Users/Banli/.ssh/id_rsa.」這里,電腦里沒找到這個文件夾,搜也搜不到...而且這串碼還不是公鑰!
這里我進行了個操作,不知道到是不是必要的~
LBLCP:~ Banli$ cd ~/.ssh #輸入了進入~/.ssh的指令
LBLCP:.ssh Banli$ pwd #查看位置
/Users/Banli/.ssh #變成了在「/.ssh」文件夾里
接下來查看真正的公鑰:
cat id_rsa.pub #??查看公鑰指令
后出來的才是公鑰,大概長這樣:
ssh-rsa AAAA***好幾行字母*** banli1001@sina.com
從開頭的「ssh-rsa」復制到郵箱號收尾。
位置:GitHub 》個人設置 Settings 》SHH and GPS Keys
點擊「New SSH key」,添加鑰匙;
標題空著,把剛剛復制的公鑰粘貼到 Key 那欄里。
然后上傳。
參考
Bilibili 手把手教你從0開始搭建自己的個人博客 |無坑版視頻教程| hexo
3.CSDN 查看本機ssh公鑰,生成公鑰