安装 web sdk

目录结构

1
2
3
4
5
6
7
8
.
├─ .vscode # Project settings directory for Visual Studio Code
├─ Core # Directory containing Live2D Cubism Core
├─ Framework # Directory containing source code
such as rendering and animation functions
└─ Samples
├─ Resources # Directory containing resources such as model files and images
└─ TypeScript # Directory containing TypeScript sample projects

下载CubismWebSamples链接:https://github.com/Live2D/CubismWebSamples

下载Framework链接:https://github.com/Live2D/CubismWebFramework

下载Core链接:https://github.com/cqc-elycio/live2dDemo/tree/master/Core

包括:live2dcubismcore.d.ts, live2dcubismcore.js, live2dcubismcore.js.map, live2dcubismcore.min.js

参考博客:https://blog.csdn.net/qq_37735413/article/details/104769280

build样例并运行demo

安装Node.js

下载地址:Node.js

安装TypeScript

安装方式:用nodejs带的npm来安装,命令: npm install -g typescript

查看node.js版本

1
2
3
4
5
6
#版本
npm -v
8.19.4

node -v
v16.20.2

换npm源

1
2
3
4
5
6
1.查看当前源
npm config get registry
2. 更换npm源为国内淘宝镜像
npm config set registry https://registry.npmmirror.com/
3. 还原npm源
npm config set registry https://registry.npmjs.org/

安装VSCode插件 Live Server

运行编译

VSCode中Teminal —> Run Build Task —> npm:build - Samples/TypeScript/Demo

预览

对 CubismWebSamples-4-r.3\Samples\TypeScript\Demo\index.html 用 Live Server Go Live 即可

模型下载

推荐下载链接:https://github.com/Eikanya/Live2d-model

使用GitZip可单个文件下载,链接:https://gitzip.org/