feat: 新增路径别名、多环境配置、生产环境打包配置

src/App.vue

@@ -1,8 +1,3 @@
-<script setup lang="ts">
-// This starter template is using Vue 3 <script setup> SFCs
-// Check out https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup
-import HelloWorld from './components/HelloWorld.vue'
-</script>
 
 <template>
   <img alt="Vue logo" src="./assets/logo.png" />

src/components/HelloWorld.vue

@@ -1,42 +1,27 @@
 <template>
-  <el-input v-model="input" placeholder="Please input" />
-  <el-input-number v-model="num" :min="1" :max="10" @change="handleChange"/>
+  <el-input v-model="num"/>
+  <el-button @click="handleClick">点击+1</el-button>
 </template>
 
-<script lang="ts">
-import {defineComponent, ref} from 'vue'
-
+<script  lang="ts">
+import {defineComponent, computed} from 'vue'
+import {userStore} from '@/store';
 
 export default defineComponent({
   setup() {
-    const num = ref(1)
-    const handleChange = (value: string) => {
-      console.log(value)
+    const store = userStore()
+    const num = computed(()=>{
+      return store.state.count
+    })
+    const handleClick = () => {
+      store.commit('increment')
     }
     return {
-      input:ref(''),
       num,
-      handleChange,
+      handleClick
     }
   },
 })
 </script>
 
 
-<style scoped>
-a {
-  color: #42b983;
-}
-
-label {
-  margin: 0 0.5em;
-  font-weight: bold;
-}
-
-code {
-  background-color: #eee;
-  padding: 2px 4px;
-  border-radius: 4px;
-  color: #304455;
-}
-</style>

src/store/index.ts

@@ -1,5 +1,5 @@
 import {InjectionKey} from 'vue'
-import {createStore, Store} from 'vuex'
+import {createStore,useStore as baseUseStore ,Store} from 'vuex'
 
 export interface State {
     count: number
@@ -20,6 +20,7 @@ export const store = createStore<State>({
     }
 })
 
-
-
+export function userStore(){
+    return baseUseStore(key)
+}