Refactor request formatting and configuration

composables/useFetchRequest.ts

@@ -1,87 +1,53 @@
-import { useFetch } from "#app";
+import { useFetch } from '#app'
-import type { UseFetchOptions } from "#app";
+import type { UseFetchOptions } from '#app'
-import { isArray } from "~/utils/utils";
+import { isArray } from '~/utils/utils'
 
-const useServerRequest = async <T>(
+const useServerRequest = async <T>(url: string, opts?: UseFetchOptions<T, unknown>) => {
-  url: string,
+  const token = useToken()
-  opts?: UseFetchOptions<T, unknown>
+  const user = useUserInfo()
-) => {
+  const runtimeConfig = useRuntimeConfig()
-  const token = useToken();
-  const user = useUserInfo();
-  const runtimeConfig = useRuntimeConfig();
 
   const defaultOptions: UseFetchOptions<unknown> = {
     baseURL: runtimeConfig.public.apiBase,
     onRequest({ options }) {
-      options.headers = options.headers || "application/json";
+      options.headers = options.headers || 'application/json'
       if (token.value) {
-        console.log('user----', user.value);
-        
-        console.log('token----', "Bearer " + token.value)
         // @ts-ignore
-        options.headers["authorization"] = "Bearer " + token.value;
+        options.headers['authorization'] = 'Bearer ' + token.value
       }
-
-      console.log(url +'-----' +'options----', options);
-      
     },
     onResponse({ response }) {
       if (+response.status === 200 && +response._data.code !== 0) {
-        process.client && ElMessage.error(response._data.msg);
+        process.client && ElMessage.error(response._data.msg)
       }
     },
     onResponseError({ response }) {
-      process.client &&
+      process.client && ElMessage.error(isArray(response._data.data.msg) ? response._data.data.msg[0] : response._data.data.msg)
-        ElMessage.error(
-          isArray(response._data.data.msg)
-            ? response._data.data.msg[0]
-            : response._data.data.msg
-        );
     },
-  };
+  }
-  console.log(url + '-----' + 'defaultOptions----', defaultOptions);
-  console.log(url + '-----' + 'opts----', opts);
 
   // return useFetch<T>(url, { ...defaultOptions, ...opts } as any);
   // 明确转换返回类型
-  const response = await useFetch<T>(url, { ...defaultOptions, ...opts } as any);
+  const response = await useFetch<T>(url, { ...defaultOptions, ...opts } as any)
-  console.log(url +'-----' + 'response----', response.data.value);
+  return response.data.value as unknown as T
-  return response.data.value as unknown as T;
+}
-};
 
-  // GET请求
+// GET请求
-  export const get = <T = unknown>(
+export const get = <T = unknown>(endpoint: string, config?: Omit<FetchOptions, 'method'>): Promise<T> => {
-    endpoint: string, 
+  return useServerRequest<T>(endpoint, { ...config, method: 'GET' })
-    config?: Omit<FetchOptions, 'method'>
+}
-  ): Promise<T> => {
-    console.log(endpoint + '----' + 'config----', config);
-    
-    return useServerRequest<T>(endpoint, { ...config, method: 'GET' })
-  }
 
-    // POST请求
+// POST请求
-  export const post = <T = unknown>(
+export const post = <T = unknown>(endpoint: string, body?: any, config?: Omit<FetchOptions, 'method' | 'body'>): Promise<T> => {
-    endpoint: string, 
+  return useServerRequest<T>(endpoint, { ...config, method: 'POST', body })
-    body?: any, 
+}
-    config?: Omit<FetchOptions, 'method' | 'body'>
-  ): Promise<T> => {
-    return useServerRequest<T>(endpoint, { ...config, method: 'POST', body })
-  }
 
-  
+// DELETE请求
-  // DELETE请求
+export const del = <T = unknown>(endpoint: string, config?: Omit<FetchOptions, 'method'>): Promise<T> => {
-  export const del = <T = unknown>(
+  return useServerRequest<T>(endpoint, { ...config, method: 'DELETE' })
-    endpoint: string, 
+}
-    config?: Omit<FetchOptions, 'method'>
-  ): Promise<T> => {
-    return useServerRequest<T>(endpoint, { ...config, method: 'DELETE' })
-  }
 
-    // PUT请求
+// PUT请求
-  export const put = <T = unknown>(
+export const put = <T = unknown>(endpoint: string, body?: any, config?: Omit<FetchOptions, 'method' | 'body'>): Promise<T> => {
-    endpoint: string, 
+  return useServerRequest<T>(endpoint, { ...config, method: 'PUT', body })
-    body?: any, 
+}
-    config?: Omit<FetchOptions, 'method' | 'body'>
-  ): Promise<T> => {
-    return useServerRequest<T>(endpoint, { ...config, method: 'PUT', body })
-  }

nuxt.config.ts

@@ -6,13 +6,19 @@ export default defineNuxtConfig({
   // },
 
   devtools: {
-    enabled: process.env.NODE_ENV === "development",
+    enabled: process.env.NODE_ENV === 'development',
   },
-  debug: process.env.NODE_ENV === "development",   // 开启详细调试日志
+  debug: process.env.NODE_ENV === 'development', // 开启详细调试日志
 
   ssr: true,
-  modules: ["@unocss/nuxt", "@pinia/nuxt", "@element-plus/nuxt",'pinia-plugin-persistedstate/nuxt','nuxt-swiper'],
+  modules: [
-  css: ["@unocss/reset/tailwind.css", "element-plus/dist/index.css","~/assets/scss/app.scss"],
+    '@unocss/nuxt',
+    '@pinia/nuxt',
+    '@element-plus/nuxt',
+    'pinia-plugin-persistedstate/nuxt',
+    'nuxt-swiper',
+  ],
+  css: ['@unocss/reset/tailwind.css', 'element-plus/dist/index.css', '~/assets/scss/app.scss'],
   vite: {
     css: {
       preprocessorOptions: {
@@ -32,18 +38,17 @@ export default defineNuxtConfig({
       },
     },
     optimizeDeps: {
-      include: ["naive-ui"],
+      include: ['naive-ui'],
     },
     // 生产环境构建优化
     build: {
       // 生产环境移除 console 和 debugger
-      minify: "esbuild",
+      minify: 'esbuild',
-      target: "es2020",
+      target: 'es2020',
     },
     esbuild: {
       // 生产环境下移除所有 console 语句和 debugger
-      drop:
+      drop: process.env.NODE_ENV === 'production' ? ['console', 'debugger'] : [],
-        process.env.NODE_ENV === "production" ? ["console", "debugger"] : [],
     },
   },
 
@@ -60,35 +65,38 @@ export default defineNuxtConfig({
     //   duration: 400,
     // },
     head: {
-      title: "图夕夕-世界图纸 夕夕共享",
+      title: '图夕夕-世界图纸 夕夕共享',
       htmlAttrs: {
-        lang: "en",
+        lang: 'en',
       },
       meta: [
-        { charset: "utf-8" },
+        { charset: 'utf-8' },
-        { name: "viewport", content: "width=device-width, initial-scale=1" },
+        { name: 'viewport', content: 'width=device-width, initial-scale=1' },
         {
-          name: "description",
+          name: 'description',
-          content: "图夕夕是一家图纸素材分享交易平台，提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。",
+          content:
+            '图夕夕是一家图纸素材分享交易平台，提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。',
         },
-        { name: "keywords", content: "图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸" },
+        { name: 'keywords', content: '图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸' },
-        { name: "author", content: "图夕夕" },
+        { name: 'author', content: '图夕夕' },
         // SEO meta tags
-        { property: "og:title", content: "图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸" },
         {
-          property: "og:description",
+          property: 'og:title',
-          content: "图夕夕是一家图纸素材分享交易平台，提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。",
+          content: '图纸,图纸下载,设计素材,图纸大全,设计图纸,,工程图纸,cad图纸',
         },
-        { property: "og:type", content: "website" },
+        {
-        { property: "og:url", content: "https://www.xlcig.cn" },
+          property: 'og:description',
-        { property: "og:site_name", content: "xlCig" },
+          content:
-        { name: "theme-color", content: "#00f5ff" },
+            '图夕夕是一家图纸素材分享交易平台，提供AutoCAD/ProE/Creo/CATIA/UG/inventor/CAXA/等建筑图纸的素材下载及免费教程。',
+        },
+        { property: 'og:type', content: 'website' },
+        { property: 'og:url', content: 'https://www.xlcig.cn' },
+        { property: 'og:site_name', content: 'xlCig' },
+        { name: 'theme-color', content: '#00f5ff' },
         // robots meta
-        { name: "robots", content: "index, follow" },
+        { name: 'robots', content: 'index, follow' },
-      ],
-      link: [
-        { rel: "icon", type: "image/x-icon", href: "/favicon2.ico" },
       ],
+      link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon2.ico' }],
     },
   },
 
@@ -98,25 +106,25 @@ export default defineNuxtConfig({
       apiBase: 'https://tuxixi.net',
 
       // 应用信息
-      appName: "xlCig",
+      appName: 'xlCig',
-      appVersion: "1.0.0",
+      appVersion: '1.0.0',
 
       // 调试模式
-      debug: process.env.NODE_ENV === "development",
+      debug: process.env.NODE_ENV === 'development',
 
       // 环境标识
-      environment: process.env.NODE_ENV || "development",
+      environment: process.env.NODE_ENV || 'development',
     },
   },
 
   build: {
-    transpile: ["vueuc", "@css-render/vue3-ssr","@unocss","@tinymce/tinymce-vue","tinymce"],
+    transpile: ['vueuc', '@css-render/vue3-ssr', '@unocss', '@tinymce/tinymce-vue', 'tinymce'],
   },
   plugins: [
     // 在这里引入插件
     // { src: "~plugins/tinymce" ,ssr: false},
   ],
   piniaPluginPersistedstate: {
-    storage: 'localStorage'
+    storage: 'localStorage',
-  }
+  },
-});
+})