为hexo 网站加上live2d看板娘

hexo-helper-live2d

下载hexo-helper-live2d
github地址

这是官网效果

好了虽然上面已经给出官网地址
但是还是给你讲解一下
打开dos命令 切换到你博客目录执行

npm install --save hexo-helper-live2d

安装完了之后打开package.json会看到你的model

之后下载各种动画model

https://github.com/xiazeyu/live2d-widget-models.git

我喜欢这样下载，在dos命令行切换到要下载的地方

git clone https://github.com/xiazeyu/live2d-widget-models.git

把packages文件夹下的所有文件复制到node_modules下

之后在博客的配置文件中添加

# Live2D
## https://github.com/EYHN/hexo-helper-live2d

live2d:
  enable: true #是否开启
  scriptFrom: local #默认
  pluginRootPath: live2dw/ #插件的站点上的根目录（相对路径）
  pluginJsPath: lib/ #脚本文件的相对与插件跟目录路径
  pluginModelPath: assets/ #模型文件对插件跟目录路径
  # scriptFrom: jsdelivr # jsdelivr CDN
  # jsdelivr CDN # unpkg CDN
  # scriptFrom: unpkg
  # unpkg CDN
  # scriptFrom: https://cdn.jsdelivr.net/npm/live2d-widget@3.x/lib/L2Dwidget.min.js # 你的自定义 url
  
  tagMode: false #标签模式，是否仅替换 live2d tag标签而非插入到所有页面中
  debug: false # 调试, 是否在控制台输出日志
  model:
    #scale: 1
    #hHeadPos: 0.5
    #vHeadPos: 0.618
    use: live2d-widget-model-haru

    #live2d-widget-model-shizuku
    #live2d-widget-model-haru

    # npm-module package name

    # use: https://cdn.jsdelivr.net/npm/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json
    # 你的自定义 url
  display:
    #superSample: 2
    position: right
    width: 150
    height: 300
    #hOffset: 0
    #vOffset: -20
  mobile:
    show: true
    #scale: 0.5
  #react:
    #opacityDefault: 0.7
    #opacityOnHover: 0.2

完了之后就

hexo g
hexo d

部署

看板娘终极进化，可换装

参考

下载静态资源包

解压复制文件夹到\themes\next\source下，并到目录下打开autoload.js修改live2d_path,为你命名的目录
const live2d_path = "/live2d-widget-master/";

/themes/next/layout/_layout.swing
文件下加入

<script src="/live2d-widget-master/autoload.js"></script>
修改waifu-tips.js中

$.ajax({
	url: "/live2d-widget-master/asteroids.js",
	dataType: "script",
	cache: true
});

把原来链接中的js保存到本地