readme

开发环境 vs 生产环境

开发环境

• 入口文件 main.dev.ts
• 没有reset的使用tdesign.min.js里面导出的组件,并注册为全局组件
• 有reset使用自定义 resolvers自动导入
• _${compo} 从@/plugins/tdesign-vue-next-for-dev引入
• h(${compo}) 从@/plugins/tdesign-vue-next-for-dev引入
• h(TForm) 从reset引入

生产环境

• 入口文件 main.prod.ts
• 没有reset使用TDesignResolver自动导入
• 有reset使用自定义 resolvers自动导入
• _${compo} 从tdesign-vue-next引入
• h(${compo}) 从tdesign-vue-next引入
• h(TForm) 从reset引入

库

• @prettier/plugin-xml 格式化xml、svg文件
• jiti eslint 配置相关
• eslint-plugin-format 格式化css, html 等文件
• postcss-html 被 stylelint-config-recommended-vue 依赖
• postcss-markdown 用于 stylelint 格式化 markdown 中的 css 代码块
• npm-run-all2 项目 script 运行命令时，需要用到的包

注意

• Ignored build scripts ** Run "pnpm approve-builds" to pick which dependencies should be allowed to run scripts

  pnpm approve-builds

  运行上述命令选择允许哪些依赖包在安装时自动执行生命周期脚本

• icons

  • 选择地址https://icon-sets.iconify.design/?category=UI+24px

  • 使用方法

    <template>
      <Icon icon="material-symbols-light:refresh"></Icon>
    </template>

• 重要的通知用 $notify, 需用户手动关闭

• 轻提示用 $msg

• 升级 tdesign 组件库时，手动对比 node_modules/tdesign-vue-next/global.d.ts

• api 文件夹里面的接口都是没有在 swagger 中定义的，是手动添加的

• 若依 新建同级同名称的菜单才会校验报错，但是name不会校验

• vue-component-type-helpers 作用 泛型

• @formkit/auto-animate dom元素里面 不能使用 v-auto-animate，要不然会内存泄露

• 不要手动导入非类型 from 'tdesign-vue-next' 会引入额外的重复文件

  // v2
  useWatcher(() => method, [xxx], { sendable: () => sendable });
  
  // v3
  useWatcher(() => method, [xxx], {
    async middleware(_, next) {
      if (sendable) {
        return next();
      }
    }
  });

• method.transformData 简化为 method.transform

  // v2
  alova.Get('/api/profile', {
    transformData(data) {
      return data.detail;
    }
  });
  
  // v3
  alova.Get('/api/profile', {
    transform(data) {
      return data.detail;
    }
  });

• method.localCache 更改为 method.cacheFor:

  // v2
  alova.Get('/api/profile', {
    localCache: 1000 * 60 * 60
  });
  
  // v3
  alova.Get('/api/profile', {
    cacheFor: 1000 * 60 * 60
  });

• 所有的 sendArgs 更改为 args

  // v2
  onSuccess(({ sendArgs }) => {
    // ...
  });
  
  // v3
  onSuccess(({ args }) => {
    // ...
  });

• 事件绑定函数返回自身对象,支持链式调用

  // v2
  const { onSuccess, loading, data } = useRequest(method);
  onSuccess(() => {
    /*...*/
  });
  
  // v3
  const { loading, data } = useRequest(method).onSuccess(() => {
    /*...*/
  });

todo

• stylelint unit-allowed-list、declaration-property-unit-allowed-list
• 整理setting.json
• 有时间尝试一下这个打包分析工具https://sonda.dev/
• server.warmup配置
• tdesign-starter
• 404 页面搞好看一点
• 封装右键菜单
• 怎么给 page 添加 lazy-view loading
• 引入自定义字体
• 上传用户图片
• 600 现在是不管成功和失败，都弹窗，需要优化
• admin 用户登录 判断哪些菜单生成了却没有被用到
• z-vue-scan
• 根据是否focus 和 loading 状态 loading
• pluginWebUpdateNotice
• 支持多级 Breadcrumb，对象存储在 recentRoutersStore 中
• GradientText 取自 css 变量
• AutoDecimal
• zx —— 真正像 JavaScript 的 Shell 脚本
• vue-skills
• [https://juejin.cn/post/7263810695459438653]
• (泛型的联合类型分发)[https://juejin.cn/post/7228833037743915067#heading-18]
• $fileView
• 添加视频插件
• markdown 渲染字体文件 regenerrarter 按钮
• Cannot read properties of undefined (reading 'messageIds')
• 右键菜单
• 开发 （使用adornment）numberRange 小数

todo 项目对比

• 用户管理：用户类型

todo 后端

• 删除 字典管理-字典数据 这个菜单
• 删除 用户管理-分配角色 这个菜单
• 删除 角色管理-分配用户 这个菜单
• 删除 系统工具-定时任务-调度日志 这个菜单
• 菜单表 图标字段
• 添加 角色权限范围 role_data_scope 这个字典
• 删除 system/user/deptTree 接口
• monitor/job/index --> tool/job/index
• 新增 /system/user/listByIds 接口

分析包大小

**/*runtime-core.esm-bundler.js,**/*vue-router.mjs,**/*reactivity.esm-bundler.js