Laravel项目升级前端到Vue3报错Vue.use is not a function如何解决

Vue 2升级Vue 3出现Uncaught TypeError: Vue.use is not a function解决方案 #

核心原因 #

Vue 3 对全局API做了破坏性更新，移除了Vue 2中挂载在全局Vue对象上的use方法，插件注册逻辑调整为从createApp生成的应用实例调用。

修复步骤 #

• 调整入口文件的实例创建逻辑
  Vue 2原有写法：

  import Vue from 'vue'
  import SomePlugin from 'some-plugin'
  // 全局注册插件
  Vue.use(SomePlugin)
  
  new Vue({
    // 根组件配置
  }).$mount('#app')
  

  改为Vue 3适配写法：

  import { createApp } from 'vue'
  import SomePlugin from 'some-plugin-vue3' // 注意使用插件的Vue3适配版本
  // 创建应用实例
  const app = createApp({
    // 根组件配置
  })
  // 用应用实例注册插件
  app.use(SomePlugin)
  // 挂载节点
  app.mount('#app')
  

• 检查所有生态依赖版本
  确认所有Vue相关依赖已经升级到适配Vue 3的版本：
  • vue-router 需升级至4.x版本
  • vuex 需升级至4.x版本，或替换为Pinia
  • UI组件库、工具类插件均需使用Vue 3适配版本，不可混用Vue 2的依赖包
• 校验Laravel前端构建配置
  检查Laravel Mix或Vite的配置文件，确认vue的引入别名指向Vue 3的依赖路径，无残留Vue 2的相关配置。
• 排查第三方插件兼容性
  如果修改入口代码后仍报错，检查是否有第三方插件仍使用Vue 2的Vue.use语法进行注册，这类不兼容插件需替换为Vue 3适配版本，或手动修改插件的注册逻辑适配新API。

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