本來就是個(gè)動(dòng)漫控晒杈，之前vue開發(fā)的個(gè)人博客被黑客攻陷洗庫洗源碼后像鸡，順便就用react重新開發(fā)了個(gè)人博客。但是問題來了框全，之前vue的博客布局到處充滿了動(dòng)漫背景就有沒看板娘沒關(guān)系」鞅睿現(xiàn)在所做的個(gè)人博客稍顯空洞（空虛寂寞）瓣铣。
網(wǎng)上找到的看板娘答朋，大多數(shù)是靜態(tài)引入script，vue也有引入棠笑，就react徹底找不到梦碗。。而且看了看大多都是以前某大牛吃的雞蓖救，后邊都是無限復(fù)用的SDK2的源碼洪规，我看了看官網(wǎng)的結(jié)構(gòu)，已經(jīng)達(dá)到了4.x了循捺。斩例。本著用新不用舊的觀念就對(duì)官方的demo魔改成可react引入的live2d看板娘了。下邊是使用方式~~
?? Install
npm install react-live2d
?? Usage for SPA
如：create-react-app
基礎(chǔ)包直接使用script引入从橘，在你個(gè)人的react項(xiàng)目的->public->index.html先插入念赶，Core里可獲得該min.js
<script src = "http://publicjs.supmiao.com/live2dcubismcore.min.js"></script>
import ReactLive2d from 'react-live2d';
const App = () => (
<>
<ReactLive2d
width={300}
height={500}
/>
</>
);
比如你想要給頁面加入模型Hiyori，那就在你的react項(xiàng)目中的public目錄下恰力，將Hiyori放入Resources資源文件夾,如
·
└─ public
└─ Resources
└─ Hiyori
可以根據(jù)個(gè)人需要設(shè)置看板娘大小叉谜、位置、對(duì)白等踩萎。
更多詳細(xì)的功能和API文檔 在
[github]https://github.com/chendishen/react-live2d
喜歡的react個(gè)人開發(fā)者請(qǐng)順手給個(gè)star噢停局，感謝~
