Vite 不支持 vuex

【问题标题】：Vite doesn't support vuexVite 不支持 vuex
【发布时间】：2022-01-05 06:14:51
【问题描述】：

我正在创建一个 Vue 应用程序。现在，我想将 vuex 添加到我的项目中。 Vuex 添加成功，但我无法添加 vuex 商店。当我包含 vuex 脚本时：

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const store = new Vuex.Store({
  state: {
    userData: "USER!"
  },
  mutations: {

  },
  actions: {

  },
  getters: {

  }
})

export default store

我收到一个错误：

未捕获的语法错误：请求的模块“/node_modules/.vite/vue.js?v=52de2cee”未提供名为“default”的导出

main.js

import { createApp } from 'vue'
import App from './App.vue'
import router from '@/router'
const app = createApp(App)
import Vuex from 'vuex'
import { store } from '@/store/users'

app.use(router)
app.use(Vuex)

app.mount('#app')

我做错了什么？非常感谢。

【问题讨论】：

标签： javascript vue.js vuex vuejs3 vite

【解决方案1】：

您展示的第一个代码块用于 Vue 2，它在 Vue 3 中不起作用。而 Vue 3 需要 Vuex 4。

在 Vue 3 应用程序中设置 Vuex 4：

安装 Vuex 4：
```
npm i -S vuex@next
```

更新商店以使用Vuex 4 createStore API（在下一步中为app.use() 创建一个插件）：

// @/store.js
import { createStore } from 'vuex'

export default createStore({
  state: {
    userData: "USER!"
  },
  mutations: {

  },
  actions: {

  },
  getters: {

  }
})

更新主脚本以使用app.use() 安装商店：

import { createApp } from 'vue'
import store from '@/store'

const app = createApp(App)
app.use(store)

demo

【讨论】：