ProComponents 基于 antd 之上来开发的高级组件：https://procomponents.ant.design/docs/intro 该组件更新比较频繁，文档中一些新的特性可能是最新组件添加的，因此在coding中需要特别留意 antd组件库：https://ant.design/components/overview-cn/
Ant Design Pro 基于 umi 来构架脚手架，我们可以通过简单的操作来初始化和启动脚手架。 https://beta-pro.ant.design/index-cn
https://umijs.org/zh-CN/plugins/plugin-initial-state
https://www.hightopo.com/demo/alarm-manage/
xs 超小屏幕如手机 sm 小屏幕如平板 md中等屏幕 lg大屏幕 xl超大屏
https://github.com/umijs/umi-request
查看更新日志，点击右上角时钟图标选中某一历史版本 查看Log，Reset Current Branch to Here 选选择Hard 然后提交
cnpm install umi-plugin-setting-drawer --save-dev cnpm install umi-plugin-antd-theme --save-dev "umi-plugin-antd-theme": "^2.1.2", "umi-plugin-setting-drawer": "^1.0.3" 同时需要配置主题相关信息config/theme.config.json，umi-plugin-antd-theme会根据遍历挣个配置动态的在node_modules.plugin-theme\theme下生成的对应的样式文件 最终在点击SettingDrawer组件进行样式调整的时候，实际就是给动态body加入样式文件的过程
我们可以将样式文件复制到/public/theme/下如果不想进行样式配置，需要把package.json devDependencies中的这两个包排除 ThemeColor 用于展示当前可选的主色，这个色彩列表由 umi-plugin-antd-theme 插件提供，该插件会将一个色彩列表放到 window.umi_plugin_ant_themeVar 变量上，SettingDrawer 会读取这个变量并给到 ThemeColor。
<ThemeColor
value={primaryColor}
colors={
hideColors
? []
: themeList.colorList[navTheme === 'realDark' ? 'dark' : 'light']
}
formatMessage={formatMessage}
onChange={(color) =>
changeSetting('primaryColor', color, hideLoading)
}
/>源码地址 https://github.com/ant-design/pro-components/packages/layout/src/components/SettingDrawer/index.tsx 参考链接：https://pro.ant.design/docs/dynamic-theme-cn 使用React+Umi+Ant Design Pro实现生产环境动态切换主题,支持暗黑主题 https://www.cnblogs.com/dygood/p/12072096.html 官方錯誤解決方案：https://github.com/ant-design/ant-design-pro/issues antd-pro 主题色实现原理 https://juejin.cn/post/6926442970388365319
更改 cssLoader 配置，修改 src 目录下 less 文件 CSS Modules 选择器名称 加载工程固定路径下主题配置文件 config/theme.config.json覆盖默认配置(配置配置为空，也就是使用组件原始配置样式) 设置dev环境临时主题色文件路径为 node_modules/.plugin-theme/theme 设置serve-static中间件，允许访问临时主题色文件 将主题色配置信息挂载在 window.umi_plugin_ant_themeVar dev环境 onDevCompileDone 如果存在临时文件，则删除 创建 .plugin-theme/theme 遍历config/theme.config.json下每个主题色，使用 antd-pro-merge-less包 buildCss 至 .plugin-theme/theme 每一个主题色，生成一个 css 文件 prod 环境与 dev 环境的差异体现在生产的文件生成在 dist/theme 目录下
设置临时文件目录 使用 glob 找到 antd-pro-merge-less 项目下所有的 less 文件路径 将所有less文件内容写入antd-pro-merge-less/.temp/temp.less以及antd-pro-merge-less/.temp/pro.less 如果config/theme.config.json配置"ignoreAntd": false 则还会导入antd模块下的所有less文件(如果没有配置dark:true， 不会加载themes/dark.less，themes/compack.less)，到 ./antd.less 将@import './antd'导入./components.less文件,同时还会根据extraLibraries配置导入antd design pro组件的样式文件 提取import文件的变量，删除 import ，写入antd-pro-merge-less/.temp/pro.less 并引用 @import './components' 将依赖的 antd 相关组件的 less 文件写入./components.less 开始遍历不同的颜色配置 根据不同配置生成 antd less 文件 使用 less 将 pro.less 文件转化为 css 文件，并替换变量
extraLibraries：@antd-design/pro-xxx 在生成样式文件时，会加载该指包中样式文件 ignoreAntd：在生成样式文件时，是否加载antd样式文件 cache：是否开启缓存 通过比较样式和antd-pro-merge-less/.temp/temp.less文件的hash，判断文件是否需要重新生成，这样就不会在每次启动的时候重新生成样式文件
return Promise.resolve( // prettier.format(content, { // parser: 'less', // }), content ); 因为prettier.format在格式化less文件时会将 @pro-global-footer-prefix-cls: ~'@{ant-prefix}-pro-global-footer' -> @pro-global-footer-prefix-cls ~'@{ant-prefix}-pro-global-footer'
pro-card组件存在Bug _@ant-design_pro-card@1.11.7@@ant-design\pro-card\es\components\Statistic\index.less
.@{ant-prefix}-statistic-title { color: @text-color; # 将之前的固定色rgba(00,00,00,0.45)修改成变量 }
如果想强制重新生成样式文件删除antd-pro-merge-less.temp\temp.less文件 重新运行即可 或者关闭缓存
-
采用26个英文字母(区分大小写)和0-9的自然数(经常不需要)加上下划线''组成，命名简洁明确，多个单词用下划线''分隔
-
全部小写命名，禁止出现大写
-
禁止使用数据库关键字，如：name，time ，datetime，password等
-
表名称不应该取得太长（一般不超过三个英文单词）
-
表的名称一般使用名词或者动宾短语
-
用单数形式表示名称，例如，使用 employee，而不是 employees
-
表必须填写描述信息（使用SQL语句建表时）
1、组件名称全部大写字母开头
2、其他 文件夹以 xxx-xxx 命名 内部文件以驼峰命名，如 eslint-utils: applyDefault.ts
1、方法命名 返回列表的 +s public List getParameterMappings() 2、成员属性命名 collection +s private List resultMappings; 3、map成员 Map<Method, MapperMethod> methodCache = new ConcurrentHashMap<>() 4、方法名称 做到望文生义 getUserById getUserByLoginName ...