feat: 删除部分app.config.globalProperties变量

.eslintrc.js

@@ -9,7 +9,7 @@ module.exports = {
     'vue/script-setup-uses-vars': 0,
     'prefer-rest-params': 0,
     'consistent-return': 0,
-    'max-len': ['error', { code: 200 }],
+    'max-len': ['error', { code: 2000 }],
     'no-console': 0,
     'no-param-reassign': 0,
   },

package.json

@@ -2,38 +2,38 @@
   "name": "vite-template",
   "version": "0.0.0",
   "scripts": {
-    "dev": "yarn lint && vite",
+    "dev": "vite",
     "build": "yarn lint && vite build",
     "serve": "yarn lint && vite preview",
     "lint": "eslint --fix ./",
     "husky": "husky install",
     "release": "standard-version"
   },
   "dependencies": {
-    "@vitejs/plugin-vue": "^1.3.0",
+    "@vitejs/plugin-vue": "^1.6.0",
     "axios": "^0.21.1",
     "element-plus": "^1.0.2-beta.65",
     "mitt": "^3.0.0",
-    "naive-ui": "^2.15.11",
+    "naive-ui": "^2.16.7",
     "qs": "^6.10.1",
     "rollup-plugin-visualizer": "^5.5.2",
     "standard-version": "^9.3.1",
-    "vite": "^2.4.4",
-    "vite-plugin-style-import": "^1.0.1",
-    "vue": "^3.1.5",
-    "vue-router": "4.0.10"
+    "vite": "^2.5.1",
+    "vite-plugin-style-import": "^1.2.1",
+    "vue": "^3.2.6",
+    "vue-router": "4.0.11"
   },
   "devDependencies": {
     "@commitlint/cli": "^13.1.0",
     "@commitlint/config-conventional": "^13.1.0",
     "@vue/cli-plugin-eslint": "~4.5.13",
-    "@vue/compiler-sfc": "^3.1.5",
-    "eslint": "^7.31.0",
+    "@vue/compiler-sfc": "^3.2.6",
+    "eslint": "^7.32.0",
     "eslint-config-airbnb-base": "^14.2.1",
     "eslint-import-resolver-alias": "^1.1.2",
-    "eslint-plugin-import": "^2.23.4",
-    "eslint-plugin-vue": "^7.14.0",
+    "eslint-plugin-import": "^2.24.2",
+    "eslint-plugin-vue": "^7.17.0",
     "husky": "^7.0.1",
-    "sass": "1.36.0"
+    "sass": "1.38.2"
   }
 }

src/api/index.js

@@ -28,8 +28,8 @@ const log = {
   },
 };
 
-export default {
-  sign,
-  user,
-  log,
+export {
+  sign as signAPI,
+  user as userAPI,
+  log as logAPI,
 };

src/components/HelloWorld.vue

@@ -20,7 +20,7 @@
 
 <script>
 import { reactive } from 'vue';
-import { signOut } from '@/utils/util';
+import { signOut } from '@/utils/helpers';
 
 export default {
   setup() {

src/main.js

@@ -4,7 +4,7 @@ import plugins from '@/plugins';
 import App from '@/App.vue';
 import router from '@/router';
 import api from '@/api';
-import { checkRes } from '@/utils/util';
+import { checkRes } from '@/utils/helpers';
 
 async function getUserInfo() {
   const userRes = await api.user.info();

src/plugins/element-plus.js

@@ -22,30 +22,14 @@ function notify(type, message, options) {
   });
 }
 
-// form check
-async function checkForm(form = 'form') {
-  return new Promise((res) => {
-    this.$refs[form].validate((valid) => {
-      res(valid);
-    });
-  });
-}
-function resetForm(form = 'form') {
-  this.$nextTick(() => {
-    this.$refs[form].resetFields();
-  });
-}
-
 export default {
   install(app) {
     app.config.globalProperties.$ELEMENT = {
       size: 'small',
     };
-    app.config.globalProperties.$notify = ElNotification;
     app.config.globalProperties.$success = (message, options) => notify('success', message, options);
     app.config.globalProperties.$error = (message, options) => notify('error', message, options);
-    app.config.globalProperties.checkForm = checkForm;
-    app.config.globalProperties.resetForm = resetForm;
+
     components.forEach((component) => {
       app.use(component);
     });

src/plugins/global-properties.js

@@ -1,11 +1,7 @@
 import mitt from 'mitt';
-import api from '@/api';
-import { checkRes } from '@/utils/util';
 
 export default {
   install(app) {
-    app.config.globalProperties.checkRes = checkRes;
-    app.config.globalProperties.$api = api;
     app.config.globalProperties.$bus = mitt();
   },
 };

src/utils/helpers.js

@@ -0,0 +1,35 @@
+function validateRefs(refs) {
+  refs = refs || Object.keys(this.$refs);
+  const errors = refs.filter((ref) => this.$refs[ref] && 'validate' in this.$refs[ref] && typeof this.$refs[ref].validate === 'function').map((ref) => this.$refs[ref].validate()).filter((val) => !!val);
+  return errors.length ? errors : null;
+}
+
+async function checkForm(form = 'form') {
+  return new Promise((res) => {
+    this.$refs[form].validate((valid) => {
+      res(valid);
+    });
+  });
+}
+function resetForm(form = 'form') {
+  this.$nextTick(() => {
+    this.$refs[form].resetFields();
+  });
+}
+
+function checkRes(res) {
+  return (res && res.data && res.data.code === 0);
+}
+
+function signOut(href = '') {
+  window.localStorage.removeItem('token');
+  window.location.href = href;
+}
+
+export {
+  validateRefs,
+  checkRes,
+  checkForm,
+  resetForm,
+  signOut,
+};

src/utils/util.js

@@ -1,7 +1,3 @@
-function checkRes(res) {
-  return (res && res.data && res.data.code === 0);
-}
-
 function setToken(token) {
   window.localStorage.setItem('token', token);
 }
@@ -10,18 +6,7 @@ function getToken() {
   return window.localStorage.getItem('token');
 }
 
-/**
- * 退出登录
- * @param {string} href 地址
- */
-function signOut(href = '') {
-  window.localStorage.removeItem('token');
-  window.location.href = href;
-}
-
 export {
-  checkRes,
   setToken,
   getToken,
-  signOut,
 };

src/views/Admin.vue

@@ -7,6 +7,9 @@
 </template>
 
 <script>
+import { userAPI } from '@/api';
+import { checkRes } from '@/utils/helpers';
+
 export default {
   data() {
     return {
@@ -18,8 +21,8 @@ export default {
   },
   methods: {
     async getUserList() {
-      const users = await this.$api.user.list();
-      if (this.checkRes(users)) {
+      const users = await userAPI.list();
+      if (checkRes(users)) {
         this.users = users.data.data;
       } else {
         this.$error('获取用户列表失败');

src/views/Sign.vue

@@ -28,6 +28,8 @@
 </template>
 
 <script>
+import { signAPI } from '@/api';
+import { checkRes, checkForm } from '@/utils/helpers';
 import { RULES } from '@/utils/rules';
 import { setToken } from '@/utils/util';
 
@@ -61,13 +63,13 @@ export default {
       this.type = TYPE.signin;
     },
     async signIn() {
-      if (await this.checkForm()) {
+      if (await checkForm()) {
         window.localStorage.setItem('username', this.user.username);
-        const res = await this.$api.sign.signIn({
+        const res = await signAPI.signIn({
           username: this.user.username,
           password: this.user.password,
         });
-        if (this.checkRes(res)) {
+        if (checkRes(res)) {
           setToken(res.data.data.token);
           window.location.href = '';
         } else {
@@ -76,12 +78,12 @@ export default {
       }
     },
     async signUp() {
-      if (await this.checkForm()) {
-        const res = await this.$api.sign.signUp({
+      if (await checkForm()) {
+        const res = await signAPI.signUp({
           username: this.user.username,
           password: this.user.password,
         });
-        if (this.checkRes(res)) {
+        if (checkRes(res)) {
           this.toSignIn();
         } else {
           this.$error('注册失败');