L2Dwidget.js L2D網頁動畫人物添加


hexo 添加live2d看板動畫

https://www.jianshu.com/p/3a6342e16e57

首先貼出官網代碼

官網地址配置:https://www.npmjs.com/package/hexo-helper-live2d

按如下步驟執行

1️⃣ 首先檢查博客主目錄下面的 package.json里是否有
"hexo-helper-live2d": "^3.0.3",依賴,有的話可以先卸載
使用命令:npm uninstall hexo-helper-live2d
之后再安裝:npm install --save hexo-helper-live2d
注意:命令都是在你的博客主目錄執行

 
我的博客目錄結構:d:/github/blog

安裝完成之后在 package.json會看到安裝的model
 
package.json依賴

此時再去 node_moduels目錄下,可以看到有如下文件夾,這些都是動畫主配置
 
node_modules目錄

2️⃣下載各種動畫model:
地址: https://github.com/xiazeyu/live2d-widget-models.git

 

3️⃣下載好之后將packages里的所有動畫模板拷貝到博客的node_modules目錄里


 
packages目錄

4️⃣配置博客站點配置文件,_config.yml

live2d:
  enable: true pluginModelPath: assets/ model: use: live2d-widget-model-epsilon2_1 #模板目錄,在node_modules里 display: position: right width: 150 height: 300 mobile: show: false #是否在手機進行顯示 

5️⃣開始部署
當使用hexo clean或者 hexo g命令的時候,這時候就可以看到如下日志了

 
構建日志

INFO HEXO-HELPER-LIVE2D: Loaded model from npm-module(1), live2d-widget-model-epsilon2_1@1.0.5 from 'D:\github\blog\node_modules\live2d-widget-model-epsilon2_1\assets'
說明已經加載到了配置的動畫模板,到此就完成了。



免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM