build vue3 后压缩的文件在哪_Vue 3学习：4. 集成vuex

安装Vuex

安装完成后在package.json中查看vuex的版本

{  "name": "vue3-meteor",  "version": "0.0.0",  "scripts": {    "dev": "vite",    "build": "vite build"  },  "dependencies": {    "vue": "^3.0.2",    "vue-router": "^4.0.0-rc.5",    "vuex": "^4.0.0-rc.2"  // 新版本的vuex  },  "devDependencies": {    "@vue/compiler-sfc": "^3.0.2",    "vite": "^1.0.0-rc.8"  }}

创建store

创建/src/store/index.js 内容如下：

import { createStore } from 'vuex';const store = createStore({    state() {        return {            count: 1        };    },    mutations: {        increment(state) {            state.count++;        }    },    actions: {        increment(context) {            context.commit('increment');        }    },    getters: {        count(state) {            return state.count;        }    }});export default store;

在store中定义了一个count

使用store

在main.js中使用store

import { createApp } from 'vue'import App from './App.vue'import './index.css'import router from './router';import store from './store';createApp(App)    .use(router)    .use(store)    .mount('#app')

改造 HelloWorld.vue, 将count修改为使用store中的内容

{{ msg }}

count is: {{ count }}

Edit components/HelloWorld.vue to test hot module replacement.

运行程序查看效果