How to solve Error app.use(store) is not a function-CodePudding

I'm trying to use vuex store so i created the file store.js containing this code

import { createApp } from 'vue'
import Vuex from "vuex"

const app = createApp;
app.use(Vuex)
const store = new Vuex.Store({

});
export default store;

And this is main.js

import 'bootstrap/dist/css/bootstrap.css'
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store/store'

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

here is the package.json i don't know why vuex does not appear even that i installed it

{
 "name": "PhoSettings",
 "version": "0.1.0",
 "private": true,
 "scripts": {
 "serve": "vue-cli-service serve",
 "build": "vue-cli-service build",
 "lint": "vue-cli-service lint"
 },
 "dependencies": {
 "axios": "^0.20.0-0",
 "bootstrap": "^4.5.3",
 "core-js": "^3.7.0",
 "vue": "^3.0.2",
 "vue-loader-v16": "npm:vue-loader@^16.0.0-alpha.3",
 "vue-router": "^4.0.0-rc.5"
 },
 "devDependencies": {
 "@vue/cli-plugin-babel": "^4.5.9",
 "@vue/cli-plugin-eslint": "^4.5.9",
 "@vue/cli-service": "^4.5.9",
 "@vue/compiler-sfc": "^3.0.2",
 "babel-eslint": "^10.1.0",
 "eslint": "^6.8.0",
 "eslint-plugin-vue": "^7.1.0"
  },
 "eslintConfig": {
 "root": true,
 "env": {
  "node": true
  },
 "extends": [
  "plugin:vue/vue3-essential",
  "eslint:recommended"
],
"parserOptions": {
  "parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
 "> 1%",
 "last 2 versions",
"not dead"
 ]
 }

and then i had the following error : Uncaught TypeError: app.use is not a function

CodePudding user response：

Since you're using the vue 3 you should install the vuex v4 using the following command :

npm install vuex@next --save

then use it like :

import { createStore } from 'vuex'

// Create a new store instance.
const store = createStore({
 
})

export default store

main.js :

import 'bootstrap/dist/css/bootstrap.css'
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store/store'

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