Hexo七牛插件安裝與使用

時間 2019-11-17

標籤 hexo 七牛 7牛插件安裝使用简体版

原文原文鏈接

前言

本篇博客主要講解七牛雲插件安裝與使用，博客中獲取七牛雲存儲的圖片主要有兩種方式，一種是在七牛控制檯中上傳圖片而後取圖片外鏈地址，另一種是用七牛雲插件+標籤語法將圖片上傳到七牛雲並顯示到咱們所寫的博客中，這裏主要介紹第二種方式。 相關網址css

註冊七牛我的帳號

首先須要到七牛雲官網註冊我的帳號。
進入控制檯建立存儲空間，以下圖所示：
將融合 CDN默認域名添加到萬網中，配置格式以下圖所示：

安裝七牛雲插件

npm install hexo-qiniu-sync --save
複製代碼

配置相關信息

配置站點文件**_config.yml**，配置入內容（注意：添加到配置文件時，把//去掉）

#plugins:
# - hexo-qiniu-sync

qiniu:
  offline: false
  sync: true
  bucket: blogwenbo
  //這裏將其註釋掉，不註釋，執行hexo g報錯
  # secret_file: sec/qn.json or C:
  access_key: your access_key
  secret_key: your secret_key
  // 上傳的資源子目錄前綴.如設置，需與urlPrefix同步
  dirPrefix: static
  //外鏈前綴
  urlPrefix: http://p2zukkwm9.bkt.clouddn.com/static
  //使用默認配置便可
  up_host: http://upload.qiniu.com
  //本地目錄
  local_dir: static
  // 是否更新已經上傳過的文件(僅文件大小不一樣或在上次上傳後進行更新的纔會從新上傳)
  update_exist: true
  image: 
    folder: images
    extend: 
  js:
    folder: js
  css:
    folder: css
複製代碼

生成七牛配置路徑，執行下面命令任意一個

hexo s
或
hexo g
//終端輸出
INFO  -----------------------------------------------------------
INFO  qiniu state: online
INFO  qiniu sync:  true
INFO  qiniu local dir:  static
INFO  qiniu url:   http://blogwenbo.com/static
INFO  -----------------------------------------------------------
INFO  Start processing
INFO  Now start qiniu sync.
INFO  Need upload file num: 0
複製代碼

就會在static目錄下生成images、css、js三個文件夾。這時咱們把測試圖片七牛雲.png放在images文件夾下，而後按照以下標籤語法書寫：

{% qnimg 七牛雲.png title:七牛雲 alt:七牛雲 'class:' extend:?imageView2/2/w/450 %}
複製代碼

同步靜態資源到七牛雲空間，主要有兩種方式，一種是使用hexo命令，還有一種是使用七牛插件命令，能夠參考GitHub文檔：hexo-qiniu-sync

//一、啓用本地服務器.即便用 hexo server 命令（簡寫爲 hexo s）
//當以本地服務器模式啓動後，會自動監測 local_dir 目錄下的文件變化， 會自動將新文件進行上傳。
若是文件進行了修改，但設置中沒有啓用 update_exist 配置，則不會更新到七牛空間。
hexo s
hexo server

//二、使用命令行命令(sync | s | sync2 | s2)
//命令行命令會掃描 local_dir 目錄下的文件，同步至七牛空間。
hexo qiniu sync
hexo qiniu s
hexo qiniu sync2
hexo qiniu s2
複製代碼

圖片處理可參考官方文檔圖片基本處理

問題解決

沒有註釋**secret_file: sec/qn.json or C:**報錯，以下圖所示： git
```
# secret_file: sec/qn.json or C:
複製代碼
```
hexo-qiniu-sync安裝好後，hexo s命令不見了，hexo d也提示問題 #41github
```
//將其註釋就行了
#plugins:
# - hexo-qiniu-sync
複製代碼
```