perf: 优化service、import类型

README.md

@@ -30,7 +30,7 @@ GitHub 项目地址：[React-Ts-Template](https://github.com/huangmingfu/react-t
 
 - **全面使用 ESM 规范**：采用模块化导入，符合现代 JavaScript 的发展趋势。
 - **包管理器强制使用 pnpm**：提高依赖安装速度，减少磁盘空间占用，解决幽灵依赖问题。
-- **样式 BEM 命名规范**：结构清晰，减少样式冲突，提升代码可维护性（为了方便样式穿透，并没有采用CSS Modules，需要的也可以自行使用）。
+- **样式 BEM 命名规范**：结构清晰，减少样式冲突，提升代码可维护性（为了方便样式穿透，并没有采用CSS Modules，需要的也可以自行使用xxx.module.scss）。
 - **文件与文件夹命名**：统一使用 `kebab-case`，这种最可靠，尤其是在版本控制共享代码时，不同操作系统对大小写的敏感性不同。
 
 ### 💡 高效的代码规范管理

src/services/service.ts

@@ -24,12 +24,35 @@ axiosInstance.interceptors.request.use(
 // 响应拦截器即异常处理
 axiosInstance.interceptors.response.use(
   (res: AxiosResponse) => {
+    // const code = res.data.code;
+    // switch (code) {
+    //   case 200:
+    //     return res.data;
+    //   case 401:
+    //     /** 登录失效逻辑... */
+    //     return res.data || {};
+    //   default:
+    //     return res.data || {};
+    // }
     return res; //res.data
   },
   (err: AxiosError) => {
+    // 如果接口请求报错时，也返回对象，如return { message: onErrorReason(error.message) }，这样使用async/await就不需要加try/catch
+    // onErrorReason(err.message) // 做一些全局的错误提示，可用ui库的message提示组件
     return Promise.resolve(err);
   }
 );
 
+/** 解析http层面请求异常原因 */
+// function onErrorReason(message: string): string {
+//   if (message.includes('Network Error')) {
+//     return '网络异常，请检查网络情况!';
+//   }
+//   if (message.includes('timeout')) {
+//     return '请求超时，请重试!';
+//   }
+//   return '服务异常,请重试!';
+// }
+
 // 导出实例
 export default axiosInstance;

src/types/global.d.ts

@@ -1,3 +1,11 @@
+declare module '*.css' {}
+declare module '*.scss' {}
+declare module '*.json' {}
+declare module '*.png' {}
+declare module '*.jpg' {}
+declare module '*.svg' {}
+declare module '*.js' {}
+
 declare interface IResponse<T = unknown> {
   code: number;
   message: string;