用途:在开发或修改 TDesign React 组件样式时使用,覆盖新建组件样式、修改现有样式和配置样式入口三类任务。静态规则参见 .codebuddy/specs/css-naming-spec.md,含 BEM 命名、状态类、尺寸类与 Design Token。
主要能力与流程:一、创建样式入口文件,在组件目录 style/ 下建立 index.js(import '../../_common/style/web/components/{component-name}/index.less';)与 css.js(import '../../_common/style/web/components/{component-name}/index.css';)。二、在组件 index.ts 中导入样式:import './style/index.js';。三、在 Common 子仓库 packages/common/style/web/components/{component-name}/index.less 编写样式,先 @import "../../_variables/index.less";,用 .@{prefix}-{component-name} 定义基础样式、&__icon 等元素样式、&--primary 等修饰类与尺寸修饰,状态类使用联合选择器如 .@{prefix}-{component-name}.@{prefix}-is-disabled。四、React 组件用 useConfig 获取 classPrefix,用 classnames 组合根类名、尺寸类与状态类,并支持 className 透传。五、子仓库提交:cd packages/common 后 git add . 与 git commit -m "style({component-name}): description",再推送到 tdesign-common 仓库。
检查清单:入口文件配置正确、组件入口导入样式、使用 @{prefix} 而非硬编码 t-、React 中用 useConfig() 取前缀、元素类名不体现 DOM 层级、状态类用联合选择器、使用 Design Token、支持 className 透传、子仓库修改单独提交。
限制:资料未提供收费、平台支持、效果数据与更多使用步骤。