2018.08.26 我在這網站發布了第一篇貼文 Hello Hexo! Test By Jerry Yang
原本在這裡是想寫演算法競賽的解題報告
用了當時蠻流行的組合 Hexo + GitHub Page 架設了 Blog 出來
Hexo 其實有段時間沒有更新了，Blog 的 package.json 設定檔長這樣
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| {
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": "3.9.0"
},
"dependencies": {
"hexo": "^3.3.0",
"hexo-autoprefixer": "^2.0.0",
"hexo-deployer-git": "^2.0.0",
"hexo-generator-archive": "^1.0.0",
"hexo-generator-category": "^1.0.0",
"hexo-generator-feed": "^2.2.0",
"hexo-generator-index": "^1.0.0",
"hexo-generator-json-content": "^4.1.6",
"hexo-generator-search": "^2.4.0",
"hexo-generator-sitemap": "^2.0.0",
"hexo-generator-tag": "^1.0.0",
"hexo-inject": "^1.0.0",
"hexo-math": "^3.0.4",
"hexo-renderer-ejs": "^1.0.0",
"hexo-renderer-less": "^1.0.0",
"hexo-renderer-marked": "^2.0.0",
"hexo-renderer-stylus": "^1.0.0",
"hexo-server": "^1.0.0"
}
}
|
Hexo 3.3.0 是在 2017.04.04 發布的，到現在 Hexo 6.1.0 已經差蠻遠的
而且之前寫的文章常常在預覽時會遇到奇怪問題，發佈都是陰差陽錯成功
再加上想要在其他環境寫 Blog（我目前寫 Blog 為 Mac 筆電，想要換在 Windows 環境寫寫看）
還有 WSL 也逐漸熟悉，就決定來做大跳板＆重整環境了。
首先聲明，以 SRE 或 DevOps 的思維來說，通常會是一版一版升級
反正是個人的東西，所以我就都不管了
為了確保升級是 OK 的，也額外複製一份出來跑升級，到時候用爛還可以還原
升級 Hexo 6
這部分我稍微參照了 hexo-starter 的官方專案去做升級
直接去手動修改版本，都升級成為最新版本。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| {
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": "6.1.0"
},
"dependencies": {
"hexo": "^6.1.0",
"hexo-autoprefixer": "^2.0.0",
"hexo-deployer-git": "^2.0.0",
"hexo-generator-archive": "^1.0.0",
"hexo-generator-category": "^1.0.0",
"hexo-generator-feed": "^2.2.0",
"hexo-generator-index": "^2.0.0",
"hexo-generator-json-content": "^4.1.6",
"hexo-generator-search": "^2.4.0",
"hexo-generator-sitemap": "^2.0.0",
"hexo-generator-tag": "^1.0.0",
"hexo-inject": "^1.0.0",
"hexo-math": "^3.0.4",
"hexo-renderer-ejs": "^2.0.0",
"hexo-renderer-less": "^1.0.0",
"hexo-renderer-marked": "^5.0.0",
"hexo-renderer-stylus": "^2.0.1",
"hexo-server": "^3.0.0",
}
}
|
沒有寫在 hexo-starter 就維持不變
接下來就把 node_modules, yarn.lock, package-lock.json 全部刪掉
1
2
3
| rm -rf node_modules
rm -rf yarn.lock
rm -rf package-lock.json
|
重跑 yarn 或 npm install（我個人喜歡 yarn，套件管理來說 npm 會比 yarn 好，詳情可以 Google 比較）
原本重新裝好就可以準備
當然怎麼會這麼簡單呢？
1
| err: Error: Function yaml.safeLoad is removed in js-yaml 4. Use yaml.load instead, which is now safe by default.
|
更新主題 Fluid
我參考了這網頁，其實再往下追查 ERROR Stack 才發現，我現在用的 Fluid 主題需要更新。
Fluid 安裝方式
Hexo 在 5.0.0 以後可以用 npm 來裝了，因此我就直接 yarn 裝起來，把 themes 裡面的 fluid 改名。
1
| yarn add hexo-theme-fluid
|
接下來就是更改 Hexo Fluid 的主題樣式……
圖片 Location 問題
改版之後，圖片解析都怪怪的，全部都跑去根目錄，而不是原本的文章裡面
後來在查官網文件 _config.yml 都才發現 hexo-renderer-marked 多了一些選項
1
2
3
4
| post_asset_folder: true
marked:
prependRoot: true
postAsset: true
|
之後把 hexo 重新清理產生就好了
不過有個 warning 一直都沒有解決
修正 Node.js circular dependency
1
2
3
4
5
6
7
| (node:96093) Warning: Accessing non-existent property 'lineno' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
(node:96093) Warning: Accessing non-existent property 'column' of module exports inside circular dependency
(node:96093) Warning: Accessing non-existent property 'filename' of module exports inside circular dependency
(node:96093) Warning: Accessing non-existent property 'lineno' of module exports inside circular dependency
(node:96093) Warning: Accessing non-existent property 'column' of module exports inside circular dependency
(node:96093) Warning: Accessing non-existent property 'filename' of module exports inside circular dependency
|
這個問題我參考了這篇解決
package.json 後面加上
1
2
3
| "resolutions": {
"stylus": "^0.57.0"
}
|
最後變成這樣
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
| {
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": "6.1.0"
},
"dependencies": {
"hexo": "^6.1.0",
"hexo-autoprefixer": "^2.0.0",
"hexo-deployer-git": "^2.0.0",
"hexo-generator-archive": "^1.0.0",
"hexo-generator-category": "^1.0.0",
"hexo-generator-feed": "^2.2.0",
"hexo-generator-index": "^2.0.0",
"hexo-generator-json-content": "^4.1.6",
"hexo-generator-search": "^2.4.0",
"hexo-generator-sitemap": "^2.0.0",
"hexo-generator-tag": "^1.0.0",
"hexo-inject": "^1.0.0",
"hexo-math": "^3.0.4",
"hexo-renderer-ejs": "^2.0.0",
"hexo-renderer-less": "^1.0.0",
"hexo-renderer-marked": "^5.0.0",
"hexo-renderer-stylus": "^2.0.1",
"hexo-server": "^3.0.0",
"hexo-theme-fluid": "^1.8.14"
},
"resolutions": {
"stylus": "^0.57.0"
}
}
|
最後再 yarn 重新安裝 hexo-renderer-stylus 一次就好
1
2
| yarn remove hexo-renderer-stylus
yarn add hexo-renderer-stylus
|
後記 Afterword
其實我理想狀況是想把這些都丟給 GitHub Action
可以直接 Push 上去後直接 CI/CD 發佈完成
雖然還在 Mac 上面打文章，不過已經把環境初步整理完成
剩下就是 Deploy 的部分了
完成後我應該會再寫一篇文章