hexo安裝與配置

參考文檔：hexo中文文檔汤功、https://blog.csdn.net/sinat_37781304/article/details/82729029等

hexo部署到github

3配阵、用 npm 安裝話經(jīng)常出現(xiàn)卡住而導(dǎo)致無法正常安裝，解決辦法就是修改 npm 的安裝源，這里選擇淘寶 NPM 鏡像抗愁，這是一個(gè)完整 npmjs.org 鏡像，你可以用此代替官方版本呵晚，同步頻率目前為 10分鐘一次以保證盡量與官方服務(wù)同步蜘腌。

npm config set registry https://registry.npm.taobao.org

4、安裝hexo

npm install -g hexo-cli

安裝hexo

5饵隙、查看版本信息

hexo -v

查看版本信息

6撮珠、初始化hexo程序

hexo init myblog

（更新npm/并更換為國內(nèi)的npm鏡像命令：npm install npm -g/
npm install -g cnpm --registry=https://registry.npm.taobao.org）

7、進(jìn)入myblog文件夾

cd myblog

（8金矛、npm install）

9芯急、查看文件夾目錄

node_modules: 依賴包
scaffolds：生成文章的一些模板
source：用來存放你的文章
themes：主題
** _config.yml: 博客的配置文件**

文件夾目錄

10、打開hexo

hexo g
hexo server

11驶俊、創(chuàng)建以用于提交

git config --global user.name "yourname"
git config --global user.email "youremail"

12娶耍、連接公鑰

ssh-keygen -t rsa -C "email"

13、查看是否成功

ssh -T git@github.com

（You've successfully authenticated, but GitHub does not provide shell access.）

14饼酿、將hexo和GitHub關(guān)聯(lián)起來榕酒，修改配置文件_config.yml

deploy:
  type: （中間有個(gè)空格，以下相同）git
  repo: https://github.com/YourgithubName/YourgithubName.github.io.git
  branch: master

15故俐、安裝deploy-git部署命令

npm install hexo-deployer-git --save

16想鹰、清除之前生成的東西

hexo clean

17、生成靜態(tài)文章

hexo generate/hexo g

18药版、部署文章

hexo deploy/hexo d

19辑舷、github中要新建一個(gè)倉庫用戶名+github.io，訪問用戶名.github.io即可

設(shè)置hexo主題

1槽片、選擇hexo主題何缓，到github上下載主題放到themes文件夾下
2肢础、修改_config.yml里的theme為該文件夾名稱

新增菜單欄選項(xiàng)

1、添加新頁面：hexo new page "xx"
2歌殃、在主題配置文件的menu中加上該頁面
3乔妈、在zh-CN.yml文件中加上中文意思

新增草稿

1、添加草稿：hexo new draft "xx"
2氓皱、預(yù)覽草稿：hexo server --draft
3路召、發(fā)布草稿：hexo publish draft "xx"

圖片處理

1、配置文件中的post_asset_folder改成true
2波材、npm install hexo-asset-image --save
3股淡、放到該文件夾下，按照md格式輸入(文件名稱/圖片名.jpg)

搜索

1廷区、npm install hexo-generator-searchdb --save
2唯灵、站點(diǎn)配置文件的擴(kuò)展下添加

search:
  path: search.xml
  field: post
  format: html
  limit: 10000

3、主題配置文件下隙轻，local_search改成true即可

local_search:
  enable: true

字?jǐn)?shù)

1埠帕、npm install hexo-symbols-count-time --save
2、站點(diǎn)配置

symbols_count_time:
  symbols: true
  time: true
  total_symbols: true
  total_time: true

寵物

1玖绿、npm install --save hexo-helper-live2d
2敛瓷、live2d插件
3、安裝合適的寵物npm install live2d-widget-model-wanko
4斑匪、在配置文件中添加即可

live2d:
  enable: true
  scriptFrom: local
  pluginRootPath: live2dw/
  pluginJsPath: lib/
  pluginModelPath: assets/
  model:
#    use: live2d-widget-model-tororo
#    use: live2d-widget-model-hijiki
    use: live2d-widget-model-wanko
  display:
    position: right
    width: 150
    height: 300
#    水平位置
#    hOffset: 0
#    垂直位置
#    vOffset: -20
  mobile:
    show: true

點(diǎn)擊彈愛心

1呐籽、在source->js目錄下新建一個(gè)js文件為click-love.js

! function (e, t, a) {
    function n() {
        c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"), o(), r()
    }

    function r() {
        for (var e = 0; e < d.length; e++) d[e].alpha <= 0 ? (t.body.removeChild(d[e].el), d.splice(e, 1)) : (d[e].y--, d[e].scale += .004, d[e].alpha -= .013, d[e].el.style.cssText = "left:" + d[e].x + "px;top:" + d[e].y + "px;opacity:" + d[e].alpha + ";transform:scale(" + d[e].scale + "," + d[e].scale + ") rotate(45deg);background:" + d[e].color + ";z-index:99999");
        requestAnimationFrame(r)
    }

    function o() {
        var t = "function" == typeof e.onclick && e.onclick;
        e.onclick = function (e) {
            t && t(), i(e)
        }
    }

    function i(e) {
        var a = t.createElement("div");
        a.className = "heart", d.push({
            el: a,
            x: e.clientX - 5,
            y: e.clientY - 5,
            scale: 1,
            alpha: 1,
            color: s()
        }), t.body.appendChild(a)
    }

    function c(e) {
        var a = t.createElement("style");
        a.type = "text/css";
        try {
            a.appendChild(t.createTextNode(e))
        } catch (t) {
            a.styleSheet.cssText = e
        }
        t.getElementsByTagName("head")[0].appendChild(a)
    }

    function s() {
        return "rgb(" + ~~(255 * Math.random()) + "," + ~~(255 * Math.random()) + "," + ~~(255 * Math.random()) + ")"
    }
    var d = [];
    e.requestAnimationFrame = function () {
        return e.requestAnimationFrame || e.webkitRequestAnimationFrame || e.mozRequestAnimationFrame || e.oRequestAnimationFrame || e.msRequestAnimationFrame || function (e) {
            setTimeout(e, 1e3 / 60)
        }
    }(), n()
}(window, document);

2、在主題theme->layout->_partials->footer文件中導(dǎo)入該js文件即可

<script type="text/javascript" src="/js/click-love.js"></script>