打开 vscode 扩展商店,搜索 DcdCss 插件核心能力及其演示 提取 tsx 文件类名 可支持部分选中、也可以支持全部选中(不选中等价于全部选中),支持类名的去重功能。 触发条件有三种
- 按下 Command+ shift + p,然后输入 Extract CSS Classes to LESS
- 快捷键 command + enter
- 右键面板点击 Extract CSS Classes to LESS
- 支持配置文件 配置文件主要支持两个配置,分别是生成 less 文件时指定默认内容,以及是否展示提示信息
- 如果源文件中已经存在类名,是否可以不生成新的类名?
- 能否支持选取一部分代码,并提取选择器,将其放置到 css 文件当中呢?
- 支持不选择代码,默认选取所有代码
- 新增类名添加到同级 less 文件的后面
- 不支持嵌套的 less (css module 在代码规范中不建议嵌套写法,css 嵌套层数过深会影响 css 性能,因此目前也不考虑)
- 如果没有 less 文件,自动新增?
- 支持生成类名过程中,每个类名下的内容补充内容
- 目前只支持 styles.类名的识别,有些是 styles['card-item']这种格式(这个现在不在代码规范当中,因此不考虑这种情况),有些是 styles、有些是 classes,这个能否只能识别呢?
- 支持在生成 CSS 类名的时候,支持的默认内容
- 支持在使用时是否支持配置 toast
- 支持 menu 菜单
- 替换功能
- 基于 DCD MUI 颜色变量生成配置 snipptes,集成到插件当中 影响面 因为采用的是 vscode 插件的形式,因此对代码的整体入侵性为 0