Migrate to pixi-live2d-display

[perqin]

The built-in live2d.min.js only supports Live2D v2.1 models. This PR migrates to the pixi-live2d-display library to add support of Live2D v3 models, and the models will be rendered to the canvas with PixiJS v5.

This PR also includes a bugfix that the model can't be loaded when there is only one model in the list.

[PFiS1737]

没法用，不知道是不是我的问题（不是很懂

[perqin]

@PFiS1737 把错误贴出来看看？

我发这个PR是因为我这边用的模型是V3的，查了一下资料发现这个repo里的live2d.min.js是2.1版本的。

[PFiS1737]

（不是很懂

[perqin]

@PFiS1737 autoload.js需要放在其他几个依赖script的后面。

[qingchenling]

请问moc3的模型怎么导？我这里报了点错。。。

index.min.js:1 
        
       [XHRLoader] Failed to load resource as json (Status 200)
Uncaught (in promise) Error: Network error.
    at a.onerror (index.min.js:1:14508)
    at a.onload (index.min.js:1:14372)

[perqin]

@qingchenling 你这个看起来是网络错误，到Chrome Dev Tools里的Network看看吧。

[qingchenling]

@perqin 我觉得不太像，后台 api 的 get 报错了

<br />
<b>Warning</b>:  file_get_contents(../model/AZ/lafei/index.json): Failed to open stream: No such file or directory in <b>C:\inetpub\wwwroot\test\live2d_api\get\index.php</b> on line <b>22</b><br />
<br />
<b>Warning</b>:  Trying to access array offset on value of type null in <b>C:\inetpub\wwwroot\test\live2d_api\get\index.php</b> on line <b>29</b><br />
<br />
<b>Warning</b>:  foreach() argument must be of type array|object, null given in <b>C:\inetpub\wwwroot\test\live2d_api\get\index.php</b> on line <b>29</b><br />
<br />
<b>Warning</b>:  Trying to access array offset on value of type null in <b>C:\inetpub\wwwroot\test\live2d_api\get\index.php</b> on line <b>32</b><br />
{
    "model": "../model/AZ/lafei/"
}

没有 index.json，但是我看 moc3 模型中没有这个文件，我在想是我模型的格式不对，还是说后台 api 的 get 也需要改。。。（如果也要改，那菜菜的我就不会力）

[perqin]

这个项目是前端项目，后台的报错我也爱莫能助了（

[coolxitech]

现在还能搞moc3的模型吗，卡在没有index.json

[qxdn]

这份代码加载海王星模型的时候位置会不对

[coolxitech]

这份代码加载海王星模型的时候位置会不对

推荐换moc3模型，可以发语音的.

[zzdhybthu]

把 index.json 改成 xxx.model3.json 就可以了

[bilibiliworld]

把 index.json 改成 xxx.model3.json 就可以了

修改了get文件夹的php，增加了一个判断，但是还是不行，你是怎么做的

[qingchenling]

把 index.json 改成 xxx.model3.json 就可以了

修改了get文件夹的php，增加了一个判断，但是还是不行，你是怎么做的

我记得好像这个项目不是很适配新版的了，你可以试着用官方的那个网页端的项目，只是需要改一改

[zzdhybthu]

把 index.json 改成 xxx.model3.json 就可以了

修改了get文件夹的php，增加了一个判断，但是还是不行，你是怎么做的

没动 php，在前端简单调了下

const loadlive2dPixi = async (jsonPath: string): Promise<void> => {
    const response = await fetch(`${jsonPath}/index.json`);
    if (response.ok) {
      try {
        await response.json();
        jsonPath = `${jsonPath}/index.json`;
      } catch (error) {
        const modelname = jsonPath.split('/').pop();
        jsonPath = `${jsonPath}/${modelname}.model3.json`;
      }
    } else {
      const modelname = jsonPath.split('/').pop();
      jsonPath = `${jsonPath}/${modelname}.model3.json`;
    }
    ...

其它就按 https://guansss.github.io/pixi-live2d-display 改的，可能还有些细节得改下但我不太记得了（