feat: support typescript in common request files

.eslintrc.js

@@ -13,6 +13,7 @@ module.exports = {
     // 自定义你的规则
     'vue/component-tags-order': ['off'],
     'vue/no-multiple-template-root': ['off'],
+    'max-params': ['off'],
     // 'no-undef': 'off', // 禁止使用未定义的变量，会把TS声明视为变量，暂时关闭
   },
   parserOptions: {

.vscode/settings.json

@@ -5,7 +5,7 @@
   "editor.defaultFormatter": "esbenp.prettier-vscode",
   "eslint.validate": ["javascript", "javascriptreact", "vue", "typescript", "typescriptreact"],
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true
+    "source.fixAll.eslint": "explicit"
   },
   "css.validate": false,
   "less.validate": false,

src/config.ts

@@ -20,3 +20,7 @@ export default {
   QINIUYUN_PLUGIN: 'https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/qiniu-js/2.5.5/qiniu.min.js',
   supportSubFont: true, // 是否开启服务端字体压缩
 }
+
+export const LocalStorageKey = {
+  tokenKey: "xp_token"
+}

src/env.d.ts

@@ -1,8 +0,0 @@
-// / <reference types="vite/client" />
-
-declare module '*.vue' {
-  import { DefineComponent } from 'vue';
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
-  const component: DefineComponent<{}, {}, any>;
-  export default component;
-}

src/types/env.d.ts

@@ -1,4 +1,4 @@
-/// <reference lib="dom" />
+// / <reference lib="dom" />
 
 interface ImportMeta {
     url: string
@@ -23,7 +23,8 @@ interface ImportMeta {
       on(event: string, cb: (...args: any[]) => void): void
     }
   
-    readonly env: ImportMetaEnv
+    // readonly env: ImportMetaEnv
+    
   
     glob(pattern: string): Record<
       string,

src/utils/axios.ts

@@ -2,12 +2,12 @@
  * @Author: ShawnPhang
  * @Date: 2021-07-13 02:48:38
  * @Description: 本地测试项目请勿修改此文件
- * @LastEditors: ShawnPhang <https://m.palxp.cn>
+ * @LastEditors: Jeremy Yu <https://github.com/JeremyYu-cn>
- * @LastEditTime: 2024-01-11 17:36:33
+ * @LastEditTime: 2024-02-26 17:54:00
  */
-import axios from 'axios'
+import axios, { AxiosRequestConfig, AxiosResponse, AxiosStatic } from 'axios'
 import store from '@/store'
-import app_config from '@/config'
+import app_config, { LocalStorageKey } from '@/config'
 
 axios.defaults.timeout = 30000
 axios.defaults.headers.authorization = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6MTAwMDEsImV4cCI6MTc4ODU3NDc1MDU4NX0.L_t6DFD48Dm6rUPfgIgOWJkz18En1m_-hhMHcpbxliY';
@@ -16,15 +16,15 @@ const baseUrl = app_config.API_URL
 
 // 请求拦截器
 axios.interceptors.request.use(
-  (config: Type.Object) => {
+  (config: AxiosRequestConfig) => {
     // const access_token = store.state.currentUser.access_token;
-    const url = config.url
+    const url = config.url ?? ""
     const values = {}
     // values.access_token = access_token;
     // values.version = version;
 
-    if (url.indexOf('http://') !== 0 && url.indexOf('https://') !== 0) {
+    if (!url.startsWith('http://') && !url.startsWith('https://')) {
-      url.indexOf('/') === 0 ? (config.url = baseUrl + url) : (config.url = baseUrl + '/' + url)
+      config.url = url.startsWith('/') ? baseUrl + url : config.url = baseUrl + '/' + url
     }
 
     if (config.method === 'get') {
@@ -44,10 +44,8 @@ axios.interceptors.request.use(
 )
 
 // 响应拦截器
-axios.interceptors.response.use(
+axios.interceptors.response.use((res: AxiosResponse<any>) => {
-  (res: Type.Object) => {
     // store.dispatch('hideLoading');
-
     // 接口规则：只有正确code为200时返回result结果对象，错误返回整个结果对象
 
     if (!res.data) {
@@ -74,16 +72,28 @@ axios.interceptors.response.use(
   },
 )
 
+type TFetchRequestConfigParams = AxiosRequestConfig & Record<string, any>
+type TFetchMethod = keyof Pick<
+  AxiosStatic, 
+  "get" | "post" | "put" | "getUri" | "request" | "delete" | "head" | "options" | "patch"
+>
+
 // export default axios;
-const fetch = (url: string, params: Type.Object, type: string | undefined = 'get', exheaders: Type.Object = {}, extra: any = {}) => {
+const fetch = (
-  if (params && params._noLoading) {
+  url: string,
+  params: TFetchRequestConfigParams, 
+  type: TFetchMethod = 'get',
+  exheaders: Record<string, any> = {},
+  extra: Record<string, any> = {}
+) => {
+  if (params?._noLoading) {
     delete params._noLoading
   } else {
     // store.commit('loading', '加载中..');
   }
 
-  const token = localStorage.getItem('xp_token')
+  const token = localStorage.getItem(LocalStorageKey.tokenKey)
-  const headerObject: Type.Object = { }
+  const headerObject: Record<string, any> = {}
   token && (headerObject.authorization = token)
   
   if (type === 'get') {
@@ -93,7 +103,7 @@ const fetch = (url: string, params: Type.Object, type: string | undefined = 'get
       ...extra,
     })
   } else {
-    return (axios as Type.Object)[type](url, params, {
+    return axios[type](url, params, {
       headers: Object.assign(headerObject, exheaders),
       ...extra,
     })

src/views/Index.vue

@@ -3,6 +3,7 @@
  * @Date: 2023-09-18 17:34:44
  * @Description: 
  * @LastEditors: Jeremy Yu <https://github.com/JeremyYu-cn>
+ * @LastUpdateContent: Support typescript
  * @LastEditTime: 2024-02-25 14:51:00
 -->
 <template>