Vue新手使用Vuex做状态管理时遇到createApp导出未找到的编译告警

根因说明 #

所有告警的触发逻辑完全一致：项目运行环境的Vue版本和你编写的代码、安装的Vuex版本存在大版本适配错位。

• main.js中找不到createApp导出：这个API是Vue 3.x专属的应用初始化方法，Vue 2.x的全局导出里没有这个方法，只要在Vue 2环境下导入它，打包工具就会抛出“导出不存在”的告警。
• Vuex内部找不到inject、reactive、watch导出：这三个是Vue 3.x才对外暴露的组合式API，你当前安装的是适配Vue 3的Vuex 4.x版本，它的源码本身就依赖这几个Vue 3的API；但环境里实际是Vue 2.x版本，没有对应导出，就会连续触发这三条告警。

实操解决步骤 #

• 先核对实际依赖版本
  执行npm ls vue vuex命令，查看本地安装的Vue、Vuex实际版本号，确认错配场景：
  • 常见错配：Vue为2.x版本，Vuex为4.x版本，两者不兼容
  • 其他错配：Vue为3.x版本，但配套的构建工具配置存在版本滞后，没有正确暴露Vue的新版API
• 按选定的技术栈版本匹配对应依赖
  • 若保留当前项目的Vue 2.x技术栈：
    卸载现有适配Vue 3的Vuex 4.x，安装Vue 2专属的Vuex 3.x版本，执行命令npm install vuex@3即可；同时将main.js的入口代码修改为Vue 2的标准写法：

    import Vue from 'vue'
    import App from './App'
    import router from './router'
    import store from './store/index'
    import vuetify from './plugins/vuetify'
    
    Vue.config.productionTip = false
    
    new Vue({
      router,
      store,
      vuetify,
      render: h => h(App)
    }).$mount('#app')
    

  • 若要沿用当前写的Vue 3初始化逻辑：
    将本地Vue版本升级到3.x及以上，执行命令npm install vue@next；同步检查vue-loader、@vue/compiler-sfc等配套构建依赖的版本，确保全部适配Vue 3，避免后续出现其他导出识别异常。
• 清理旧依赖缓存
  依赖版本调整完成后，删除本地的node_modules文件夹和package-lock.json锁文件，重新执行npm install全量安装依赖，避免旧缓存导致的导出识别错误。

注意：Vuex的版本适配规则为，Vue 3搭配使用Vuex 4.x版本，Vue 2搭配使用Vuex 3.x版本，跨大版本混用必然会触发大量导出找不到的编译告警。

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