2018.08.26 我在這網站發布了第一篇貼文 {% post_link hello-world %} 原本在這裡是想寫演算法競賽的解題報告 用了當時蠻流行的組合 Hexo + GitHub Page 架設了 Blog 出來
Hexo 其實有段時間沒有更新了，Blog 的 package.json 設定檔長這樣
{
"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 也逐漸熟悉，就決定來做大跳板＆重整環境了。
反正是個人的東西，所以我就都不管了
為了確保升級是 OK 的，也額外複製一份出來跑升級，到時候用爛還可以還原
升級 Hexo 6#
這部分我稍微參照了 hexo-starter 的官方專案去做升級
直接去手動修改版本，都升級成為最新版本。
{
"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 全部刪掉
rm -rf node_modules
rm -rf yarn.lock
rm -rf package-lock.json
重跑 yarn 或 npm install（我個人喜歡 yarn，套件管理來說 npm 會比 yarn 好，詳情可以 Google 比較）
yarn
原本重新裝好就可以準備
hexo s
當然怎麼會這麼簡單呢？
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 主題需要更新。
Hexo 在 5.0.0 以後可以用 npm 來裝了，因此我就直接 yarn 裝起來，把 themes 裡面的 fluid 改名。
yarn add hexo-theme-fluid
接下來就是更改 Hexo Fluid 的主題樣式……
圖片 Location 問題#
改版之後，圖片解析都怪怪的，全部都跑去根目錄，而不是原本的文章裡面
後來在查官網文件 _config.yml 都才發現 hexo-renderer-marked 多了一些選項
post_asset_folder: true
marked:
prependRoot: true
postAsset: true
之後把 hexo 重新清理產生就好了
hexo clean
hexo s
不過有個 warning 一直都沒有解決
修正 Node.js circular dependency#
(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 後面加上
"resolutions": {
"stylus": "^0.57.0"
}
最後變成這樣
{
"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 一次就好
yarn remove hexo-renderer-stylus
yarn add hexo-renderer-stylus
後記 Afterword#
其實我理想狀況是想把這些都丟給 GitHub Action 可以直接 Push 上去後直接 CI/CD 發佈完成 雖然還在 Mac 上面打文章，不過已經把環境初步整理完成 剩下就是 Deploy 的部分了
完成後我應該會再寫一篇文章