[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Latest commit

 

History

History
 
 

chat2db-client

技术选型

  1. 脚手架:umi v4
  2. 组件库:antd v5
  3. 状态管理库 dva
  4. 图表库
  5. 国际化

目录结构 tree ./ -L 2 -I node_modules

启动项目

强制使用 yarn,因为环境变量、lock 文件只维护了 yarn,npm/pnpm 可能会产生意想不到的 bug node 版本要求 16 以上 npm i -g yarn yarn yarn run build:web:prod cp -r dist ../chat2db-server/chat2db-server-start/src/main/resources/static/front (复制打包结果到指定目录。windows 可能命令不一样,可以手动复制下) 之后就可以启动后端了 mvn clean package -B '-Dmaven.test.skip=true' -f chat2db-server/pom.xml

启动前端项目调试 yarn run start:web 注意:因为 electron 包比较难下载,如果 yarn 时 electron 下载失败或超时,可以删除掉 chat2db-client/package.json 下的 electron,再次 yarn

TS书写规范

  1. 所有的interface 与 type 必须已I开头 interface IState { name: string } // good interface State { name: string } // bad

如何在 js 与 css 中使用颜色

具体转换在 /theme/index.ts 中的 injectThemeVar

  • js 在 window._AppThemePack 中去取 eg:window._AppThemePack.controlItemBgActive // good
  • css eg: background: var(--control-item-bg-active) // good
  • css color: #fff // bad

如何使用国际化

所有 key 参考格式为 模块名称.文案类型.文案描述。若文案包含可变部分,可使用 {1}{2}{3} 代替。

src/i18n/index.ts 中默认导出 i18n 转换方法,可以将 key 转换为对应的实际文案。文案中的 {1} 将被替换为第二个入参,以此类推。例如:

// 'home.tip.welcome': '欢迎您,{1}!'
i18n('home.tip.welcome', user.name); // => '欢迎您,张三!'

也可以使用 src/i18n/index.ts 中导出的 i18nElement 方法,可以将文案中的占位符替换为 JSX 元素。例如:

i18nElement('home.tip.welcome', <b>{user.name}</b>); // => <>欢迎您,<b>张三</b>!</>'
├── dist
│   ├── index.html
│   ├── layouts__index.async.js
│   ├── layouts__index.chunk.css
│   ├── p__docs.async.js
│   ├── p__index.async.js
│   └── umi.js
├── package.json
├── readme.md
├── release
│   ├── Chat2DB-1.0.0-arm64-mac.zip
│   ├── Chat2DB-1.0.0-arm64-mac.zip.blockmap
│   ├── Chat2DB-1.0.0-arm64.dmg
│   ├── Chat2DB-1.0.0-arm64.dmg.blockmap
│   ├── builder-debug.yml
│   ├── builder-effective-config.yaml
│   └── mac-arm64
├── src
│   ├── assets
│   ├── blocks
│   ├── components
│   ├── config
│   ├── constant
│   ├── layouts
│   ├── locales
│   ├── main
│   ├── models
│   ├── pages
│   ├── typings
│   └── utils
├── tsconfig.json
├── typings.d.ts
└── yarn.lock