ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

Live2D Widget 模型库安装教程:22 个模型怎么选、怎么装,一篇完整指南

Live2D Widget 模型库安装教程:22 个模型怎么选、怎么装,一篇完整指南 Live2D Widget 模型库安装教程22 个模型怎么选、怎么装一篇完整指南【免费下载链接】live2d-widget-modelsModel library for live2d-widget.js项目地址: https://gitcode.com/gh_mirrors/li/live2d-widget-models想在博客侧边栏放一个会眨眼、会挥手的虚拟伙伴吗用 live2d-widget-models 这个 Live2D 模型库就能搞定——它把 20 多个开箱即用的 Live2D 模型拆成了独立的 npm 包一条命令就能装进你的网站项目。一分钟认识它这个项目本质上是一个模型仓库每个文件夹装一套完整的 Live2D 模型资源包括渲染用的.moc模型文件、贴图、.mtn动作、物理模拟与表情配置部分模型还自带snd/目录里的语音文件。它依赖的技术栈很简单Node.js npm 负责安装分发模型本身由 Live2D SDK 体系渲染前端则由配套的 live2d-widget.js 库负责在网页里跑起来。你不需要会建模只要会敲npm install就行。模型怎么挑22 个模型一览每个模型对应packages/下的一个文件夹npm 包名就是文件夹名。想挑得准先看功能差异声音、物理摆动、表情、姿势这几项并不是人人都有。模型包声音物理表情姿势live2d-widget-model-chitose—✔✔✔live2d-widget-model-epsilon2_1—✔✔—live2d-widget-model-gf————live2d-widget-model-haru01✔✔✔✔live2d-widget-model-haru02✔✔✔✔live2d-widget-model-haruto—✔——live2d-widget-model-hibiki✔✔✔—live2d-widget-model-hijiki———✔live2d-widget-model-izumi✔✔✔—live2d-widget-model-koharu—✔——live2d-widget-model-miku—✔——live2d-widget-model-ni-j—✔—✔live2d-widget-model-nico—✔—✔live2d-widget-model-nietzsche—✔—✔live2d-widget-model-nipsilon—✔—✔live2d-widget-model-nito—✔—✔live2d-widget-model-shizuku✔✔✔✔live2d-widget-model-tororo———✔live2d-widget-model-tsumiki—✔✔—live2d-widget-model-unitychan—✔——live2d-widget-model-wanko————live2d-widget-model-z16—✔✔—挑的时候有两种思路省事的做法装完 live2d-widget.js 后随便挑一个顺眼的比如 miku 或 shizuku先跑起来喜欢哪个换哪个。一次看全把几个风格不同的模型都装上在本地预览里对比再留一个在package.json里。一个容易踩的坑haru 有 01、02 两套造型但它们共用同一个包名live2d-widget-model-haru装一次就两套都有了不用装两遍。两条安装路径路径 A全量模型一次装齐npm install live2d-widget-models这个聚合包会依赖上面全部模型。先停一下官方已把该包标记为 deprecated弃用并明确提示请改为手动安装单个模型——因为它不会把模型依赖写进你自己的生产环境项目装了对最终站点可能不生效。所以这条路径只适合本地预览、挑模型不建议留在正式项目里。路径 B只装一个模型推荐先安装渲染库再挑一个模型装进来以 haru 为例npm install --save live2d-widget-model-haru想换别的模型把命令里最后一段换成上表中的包名即可规则就是包名 packages/下的文件夹名。装完之后让它动起来模型装好只是第一步它不会自己出现在页面上引入并初始化 live2d-widget.js 库这是负责把.moc、动作、贴图渲染成页面上那个会动的人物的 JavaScript 库。在它的配置里指定你要用的模型文件如haru01.model.json动作、物理、表情都会跟着这个入口文件加载。浏览器打开页面看到侧边栏里的人物随鼠标互动就算成功了。配置细节别在这里硬背直接去查 live2d-widget.js 项目的文档如果你用的是 Hexo 博客也可以看看 hexo-helper-live2d 这个插件它能帮你把模型接进博客框架。写在最后Live2d-widget-models 的价值就一句话省去你自己找模型、导资源、搭目录的功夫22 个 Live2D 模型随挑随装。先按路径 B 装一个跑起来剩下的交给预览对比——你博客里的虚拟伙伴五分钟就能上岗。【免费下载链接】live2d-widget-modelsModel library for live2d-widget.js项目地址: https://gitcode.com/gh_mirrors/li/live2d-widget-models创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表