react-live2d

![npm](https://img.shields.io/npm/dt/react-live2d) ![NPM](https://img.shields.io/npm/l/react-live2d) ![npm](https://img.shields.io/npm/v/react-live2d) 服务器配置较差,网站首次打开,看板娘需要加载大量模型和动作,请耐心等候 [示例地址](test2.supmiao.com) ## 目录说明 ├─ Core                  # Cubism Core 核心库 └─ Samples              # 示例项目    └─ TypeScript       └─ Demo            # 直接在此处npm install后 npm run build:prod得到打包的bundle.js,按照index.html的引入方式引入到项目即可     └─ Resources # 这里面放的是live2D的模型及动作导出的文件,需要添加自定义模型,请在此处添加,注意文件夹名字即为模型名字     └─ Framework # 包含渲染和动画功能等的源代码的目录          └─ src          # 核心代码 ## 📦 Install 为了不增加npm包的负担,基础包还是直接使用script引入,在你个人的react项目的->public->index.html先插入 ```bash npm install react-live2d ``` ## 🔨 Usage ```jsx import ReactLive2d from 'react-live2d'; const App = () => ( <> ); ``` 比如你想要给页面加入模型Hiyori,那就在你的react项目中的public目录下,将Hiyori放入Resources资源文件夹,如 └─ public                └─ Resources └─ Hiyori api 文档 (待完善,如有需要功能欢迎提[issue](https://github.com/chendishen/Live2DBase/issues)) | 成员 | 说明 | 类型 | 默认值 | | ----- | ----- | ----- | ----- | | width | 盒子宽度 | Number | 300 | | height | 盒子高度 | Number | 400 | | top | position:relative的top值 | String | '' | | right | position:relative的right值 | String | '0' | | bottom | position:relative的bottom值 | String | '0' | | left | position:relative的left值 | String | '' | | ModelList | 模型列表,暂时只展示数组的第一个模型 | Array | ['Hiyori'] |