前言
這篇博文講的Typora,不止可以用來寫個人博客,還可以用來寫博客園,加上自己搞個圖床,在Typora上傳圖片就自動上傳圖床庫上去,真的很方便。也可以在CSDN寫博客,然后在那邊復制過來,使用的是CSDN的圖床。
我用博客園說的Windows Live Writer這個安裝不了。
1. Hexo添加文章時自動打開編輯器
首先在站點目錄下的scripts目錄中創建一個JavaScript腳本文件。如果沒有這個scripts目錄,則新建一個。
- scripts目錄新建的JavaScript腳本文件可以任意取名。
通過這個腳本,我們用其來監聽hexo new
這個動作,並在檢測到hexo new
之后,執行編輯器打開的命令。
- 如果你是windows平台的Hexo用戶,則將下列內容寫入你的腳本:(直接復制,不用改)
var spawn = require('child_process').exec;
hexo.on('new', function(data){
spawn('start "markdown編輯器絕對路徑.exe" ' + data.path);
});
- 如果你是Mac平台Hexo用戶,則將下列內容寫入你的腳本:(直接復制,不用改)
var exec = require('child_process').exec;
hexo.on('new', function(data){
exec('open -a "markdown編輯器絕對路徑.app" ' + data.path);
});
2. 新建文章時,在相同目錄下創建同名文件夾(便於圖片管理)
- 打開站點配置文件
_config.yml
,搜索post_asset_folder
字段,設置其值為true
- 安裝hexo-asset-image:
npm install hexo-asset-image --save
- 此時
hexo new "fileName"
會在/source/_posts
目錄下創建同名的文件夾 - 只需在 md 文件里使用

,無需路徑名就可以插入圖片。但是我們會使用圖床,存到這只是為了以后圖床失效可以找到圖片。
3. 圖床
我本來是使用阿里雲來存儲,但是好貴,我換成一個免費的 路過圖床。
圖床有很多,比如阿里雲,騰訊雲,又拍雲等,這些都是可以用的。
也可以把圖床存在CSDN,從CSDN文章copy過去,但是切記要本地保存,別以后CSDN失效找不到圖。
到阿里雲,沒注冊的先去注冊一下。然后如下圖:
- 先去購買流量包,不貴,一年40G才9元。我現在才發現,買了流量包還是要錢的,現在收費的圖床都是分流量包和存儲包。。所以可能需要額外收費,如果是小型網站訪問量很小的,那肯定支付得起,幾分錢。大型的話就不要了,而且我們得設置防盜鏈,防止被人惡意刷請求。
- 然后去創建一個Bucket,然后如下填入就創建。
- 順便點開右上角我們的頭像,如圖:點開AccessKey管理
- 點開完,出現下面的這個,如果有用戶AccessKey就把它的AccessKey ID和Access Key Secret保存到txt,我記得剛創建會自動下載一個文件,該文件就保存這兩個鍵值對。
- 如果沒有,則創建該用戶,然后就會彈出一個下載框下載一個文件。
- 然后先放着,下面的自動變圖床鏈接的編譯器要用
注意:請開啟防盜鏈,如下:
4. 自動變圖床鏈接的編譯器
我是在網上發現一個typora的插件,可以自動把上傳的本地連接。
原作者,我fork到我的github,測試了一下,最新版能夠用,下面是我的教程:
- 先把該項目下載下來,然后里面有window.html和plugins兩個文件。然后我在我的github這樣寫。
- 最后,得去配置好我們的圖床,在
plugins\image
的upload.js文件,該文件就是可以配置我們的圖床。把剛剛在阿里雲下載的文件中,兩個AccessKeyId和AccessKeySecret的值復制進去。
- 而BucketDomain需要去阿里雲的OSS中的文件管理,先隨便上傳一張圖片,然后點擊看看它的鏈接,如圖:
- 然后把類似
http://flunggg.oss-cn-shenzhen.aliyuncs.com/
復制到BucketDomain去。 - 這個upload.js文件可以自定義配置很多東西,比如我上面限制上傳文件大小最多為10MB,不過一般不要這么大,最多4MB左右,或者去壓縮一下,推薦一個壓縮網站:tinyjpg。太大的可以去壓縮一下再放到圖床。
注意:可能有時對於舊文章想上傳,鼠標點一下,等候一下就會上傳,如果沒有上傳則重新本地上傳就會自動變為圖床鏈接。並且再改變圖片樣式時不成功,我想把圖片縮小點就不成功。但是確實方便很多。
參考: