fix(vue3): 更新到 vue3 正式版并修复错误

.prettierrc.js

@@ -1,6 +1,4 @@
 module.exports = {
-  eslintIntegration: true,
-  stylelintIntegration: true,
   printWidth: 999,
   singleQuote: true,
   semi: false,

package.json

@@ -28,7 +28,6 @@
     "@types"
   ],
   "dependencies": {
-    "@vue/cli-plugin-unit-mocha": "~4.5.0",
     "ant-design-vue": "^2.0.0-beta.6",
     "axios": "^0.20.0",
     "core-js": "^3.6.5",
@@ -40,46 +39,46 @@
     "vuex-persistedstate": "^3.1.0"
   },
   "devDependencies": {
-    "@types/chai": "^4.2.12",
+    "@types/chai": "^4.2.11",
     "@types/lodash": "^4.14.161",
-    "@types/mocha": "^8.0.3",
+    "@types/mocha": "^5.2.4",
     "@typescript-eslint/eslint-plugin": "^2.33.0",
     "@typescript-eslint/parser": "^2.33.0",
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-eslint": "~4.5.0",
     "@vue/cli-plugin-router": "~4.5.0",
     "@vue/cli-plugin-typescript": "~4.5.0",
-    "@vue/cli-plugin-unit-mocha": "^4.5.6",
+    "@vue/cli-plugin-unit-mocha": "~4.5.0",
     "@vue/cli-plugin-vuex": "~4.5.0",
     "@vue/cli-service": "~4.5.0",
     "@vue/compiler-sfc": "^3.0.0-0",
-    "@vue/eslint-config-standard": "^5.1.2",
+    "@vue/eslint-config-prettier": "^6.0.0",
     "@vue/eslint-config-typescript": "^5.0.2",
-    "@vue/test-utils": "^2.0.0-beta.4",
+    "@vue/test-utils": "^2.0.0-0",
     "babel-eslint": "^10.1.0",
     "babel-plugin-import": "^1.13.0",
-    "chai": "^4.2.0",
+    "chai": "^4.1.2",
     "commitizen": "^4.2.1",
     "cz-conventional-changelog": "3.3.0",
+    "deepmerge": "^4.2.2",
     "eslint": "^6.7.2",
     "eslint-config-prettier": "^6.11.0",
     "eslint-plugin-import": "^2.20.2",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-prettier": "^3.1.4",
+    "eslint-plugin-prettier": "^3.1.3",
     "eslint-plugin-promise": "^4.2.1",
     "eslint-plugin-standard": "^4.0.0",
     "eslint-plugin-vue": "^7.0.0-0",
     "http-server": "^0.12.3",
-    "less": "^2.7.3",
+    "less": "^2.8.0",
     "less-loader": "^5.0.0",
-    "prettier": "^2.1.1",
+    "prettier": "^1.19.1",
     "style-resources-loader": "^1.3.2",
     "ts-node": "^9.0.0",
     "typedoc": "^0.19.0",
-    "typescript": "4.0.2",
+    "typescript": "~3.9.3",
     "vue-cli-plugin-style-resources-loader": "~0.1.4",
-    "vue-property-decorator": "^9.0.0",
-    "vuex-persistedstate": "^3.1.0"
+    "vue-property-decorator": "^9.0.0"
   },
   "eslintConfig": {
     "root": true,

src/config/app.ts

@@ -2,7 +2,6 @@
 import { message } from 'ant-design-vue'
 
 const AppConfig = {
-  $message: message,
-  a: 1
+  $message: message
 }
 export { AppConfig }

src/utils/hooks/modal.ts

@@ -0,0 +1,3 @@
+export default function () {
+  console.log('hahah')
+}

src/views/About.vue

@@ -6,26 +6,39 @@
     <test-demo />
     <router-link to="/about/me">kjfkjsk</router-link>
     <router-view />
-    <self-button />
+    <a-button @click="changeState">改变</a-button>
+    <p>{{ state.name }}</p>
+    <p>{{ state1.name }}</p>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue'
+import { defineComponent, reactive, ref, onMounted } from 'vue'
 import TestDemo from '../components/TestDemo.vue'
 import HelloWorld from '../components/HelloWorld.vue'
-import SelfButton from '../components/SelfButton.vue'
 
 const About = defineComponent({
   setup() {
+    onMounted(() => {
+      console.log('mounted')
+    })
+    const state = { name: 'init' }
+    const state1 = reactive({
+      name: '1111'
+    })
+    const changeState = () => {
+      console.log('2324234')
+      state.name = 'hahahah'
+      state1.name = 'chageddddd'
+      console.log(state)
+    }
     const c = ref(0)
     const root = ref(null)
-    return { root, c }
+    return { root, c, state, changeState, state1 }
   },
   components: {
     TestDemo,
-    HelloWorld,
-    SelfButton
+    HelloWorld
   },
   data() {
     return {

src/views/AboutMe.vue

@@ -33,7 +33,10 @@ const AboutMe = defineComponent({
   },
   methods: {
     caculatePageName(): string {
-      return this.book.pageName.split('-').reverse().join()
+      return this.book.pageName
+        .split('-')
+        .reverse()
+        .join()
     }
   }
 })