Vue3环境使用vue-3d-model遇Uncaught TypeError错误求助

问题根源 #

你安装的vue-3d-model@1.4.1是针对Vue2开发的版本，内部依赖了Vue2的Vue.extend API，而Vue3中全局Vue对象已移除该方法，因此触发报错。仓库中的TypeScript文件是适配Vue3的版本，但你安装的是旧的Vue2分支包。

解决步骤 #

1. 卸载旧版本
   执行命令：

npm uninstall vue-3d-model

2. 安装Vue3适配版本
   安装专门针对Vue3的版本（当前为2.x分支，可通过@next或指定版本号安装）：

npm install vue-3d-model@next
# 或指定具体版本，比如 npm install vue-3d-model@2.0.0

3. 调整组件导入/注册方式

• 局部注册（Options API）：

<script>
import { ModelStl } from 'vue-3d-model';
export default {
  components: { ModelStl },
  // 其他业务代码
}
</script>

• 全局注册：

// main.js
import { createApp } from 'vue';
import App from './App.vue';
import Vue3DModel from 'vue-3d-model';

const app = createApp(App);
app.use(Vue3DModel);
app.mount('#app');

验证 #

安装完成后检查package.json中的依赖，确保vue-3d-model版本为2.x及以上，重新启动项目即可正常使用组件。

内容的提问来源于stack exchange，提问作者Mike Jia