OhMyLive2D Web 组件 – 本地部署

程 涛 发布于 2024-12-23 159 次阅读


在自己的站点目录下创建一个储存组件的目录,然后打开终端拉取下载组件

npm install oh-my-live2d

更新

npm install oh-my-live2d@latest

官方网站:

OhMyLive2D

里面有更详细的使用教程(此域名已废弃如需使用需访问零时网站https://oml2d.hacxy.cn)

我这里使用官网中的快速体验,js如下

<script src="https://unpkg.com/oh-my-live2d@latest"></script>
<script>
  OML2D.loadOml2d({
    models: [
      {
        path: 'https://model.oml2d.com/HK416-1-normal/model.json',
        position: [0, 60],
        scale: 0.08,
        stageStyle: {
          height: 450
        }
      }
    ]
  });
</script>

这里提供给的 https://unpkg.com/oh-my-live2d@latest 可以换成本地的index.min.js 位置在 /2D/node_modules/oh-my-live2d/dist/index.min.js (这里的2D是我自己建的储存组件的目录,可以换成自己的)

模型可以在https://github.com/oh-my-live2d/live2d-models下载模型到本地

打开/2D/node_modules/oh-my-live2d/dist/index.jsindex.min.js。Ctrl + F 搜索 package.json 替换成本地 /2D/node_modules/oh-my-live2d/package.json

这样就可以本地使用OhMyLive2D Web 组件了

如果你和我一样不喜欢那个关于按钮可以打开上述两个文件搜索

      {
        id: "About",
        icon: "icon-about",
        title: "关于",
        onClick() {
          window.open("https://oml2d.com");
        }
      }
,{id:"About",icon:"icon-about",title:"关于",onClick(){window.open("https://oml2d.com")}}

删掉或者换成其他链接就没啦

此作者没有提供个人介绍。
最后更新于 2025-02-13