# @duro-app/eslint-plugin 中文文档

规范地址：https://npmcn.com/package/%40duro-app/eslint-plugin/

版本：6\.1\.0
npm 元数据更新时间：2026-11-12T13:44:55.543Z
中文译文更新时间：2026-11-13T00:39:25.067Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40duro-app/eslint-plugin
原文对照：https://npmcn.com/package/%40duro-app/eslint-plugin/?lang=original
项目主页：https://github.com/fredericrous/duro-design-system
源码仓库：https://github.com/fredericrous/duro-design-system

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：198 kB，59 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：^18\.18\.0 \|\| ^20\.9\.0 \|\| \>=21\.1\.0
- 运行依赖：1 个
- peer 依赖：eslint ^9\.0\.0 \|\| ^10\.0\.0
- 首次发布：2026-08-12T13:15:58.335Z
- 最新版本发布：2026-11-12T13:44:55.211Z
- 近 30 天下载量：7064（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：80（近 12 个月 80 个）

## 中文简介

ESLint 执行 Duro 设计系统常规的规则: react-strict-dom html. \* 元素,深符号导入,符号值高于生px/hex,没有被贬值的表部分.

## 安装

```sh
npm install @duro-app/eslint-plugin
```

也可以使用：`pnpm add @duro-app/eslint-plugin`、`yarn add @duro-app/eslint-plugin`、`bun add @duro-app/eslint-plugin`

## README

# @duro-app/slint-plugin (英语)

执行杜罗设计系统常规的ESLint规则—— cLAUDE. MD只能建议这些规则门.

需要 ESLint 9(平面配置) 。 该插件具有零运行时间依赖性.

## 使用量

```js
// eslint.config.js
import duro from '@duro-app/eslint-plugin'
import tseslint from 'typescript-eslint'

export default [
  ...tseslint.configs.recommended,
  duro.configs.recommended,
  {
    rules: {
      // Example: a data grid the design system doesn't cover yet.
      'duro/no-raw-html-element': ['error', {allow: ['table', 'thead', 'tbody', 'tr', 'th', 'td']}],
    },
  },
]
```

这个 `recommended` 预设在 `duro` 命名空间,所以 你不必亲自登记 也不要手动登记 另一把钥匙——你会得到两个活的名字空间和混淆的配置.

## 规则

| 规则 | 预设 | 修补 |
| --- | --- | --- |
| `duro/no-raw-html-element` | 错误 | 建议 |
| `duro/no-tokens-barrel-import` | 错误 | 自动修正 |
| `duro/no-deprecated-table-parts` | 错误 | 自动固定/ 建议 |
| `duro/no-raw-design-values` | 错误 | 建议 |
| `duro/no-raw-layer-values` | 警告( e) | 建议 |
| `duro/no-raw-breakpoint-query` | 错误 | 自动修正 |

### 无浏览- html- 元素

原小写 JSX 内在`<div>`, (中文(简体) ), `<span>`,.)必须反应限制度 `html.*` 要素。 SVG子树被豁免(RSD没有SVG原始种). 元素 RSD 不导出(`<table>`, (中文(简体) ), `<canvas>`(.) 报告为非便携式; 允许通过 `allow`重写是一个建议, 不是自动修补,因为 `html.*` 道具比原始的DOM道具更为严格——a 机械 `--fix` 可以将错误换成类型错误.

选项 : `{allow?: string[], reportUnsupported?: boolean, htmlModule?: string}`

### 无托肯-管-进口

`import {colors} from '@duro-app/tokens'` 打破 StyleX bail 插件。 这个 自动固定将枪管导入分割为右深导入 (单位:千美元)`@duro-app/tokens/tokens/colors.css`,...),保留别名并内含 `type` 示众. 输入任何未标记的无固定标记的报告 .

选项 : `{packages?: string[]}`

### 无折旧表部分

旗帜 `<Table.Container>` (Root拥有现在的容器查询;只报告) - 解围是无法自动化的布局 - 不安全) 和 无操作 `isActions` 打开道具 `<Table.HeaderCell>` (文字值自动修正 值是一个表达式)。 以标识符名称匹配( N)`Table`, (中文(简体) ), `TableCore` 以 默认)——通过 `tableIdentifiers`。 。 。 .

### 无绘图设计值

内部 `css.create()` 对象,原始设计值就是发现——任何东西 与物证等价物, 和任何在有证物的财产上 缩放 :

-   **颜色** - 十六进制/ `rgb()` 编号 : `hsl()` 随处出字. 调色板值 建议 `colors.*` 符号; 一个不固定的平板报告 .
    
-   **间距和半径** 数字或 `'Npx'` 粘贴/边距/差距 家庭状况 `spacing.*`在边境线上 `radii.*`。在 缩放表示符号; 从缩放缩放缩放`marginTop: 23`它报告—— "不是象征"才是重点.
    
-   **断点** 内出血 `'@media …'` 编号 : `'@container …'` 条件 键。 在比例上它建议计算出的密钥 ``[`@media (min-width: ${breakpoints.md})`]`` 和导入.
    
-   **字体大小** (数目, `px` 或者说 `rem`页:1 `typography.fontSize*` 或,用于 步骤打字缺乏, `typeScale.fontSizeN`· ; **字体重量** 400-700 — (单位:千美元) `typography.fontWeight*`· ; **`boxShadow`** → `shadows.*` 确切的匹配, 报告; **`transitionDuration` 编号 : `animationDuration`** `'Nms'` → `duration.*`· ; **时间函数** → `easing.*`。 。 。 .
    
-   **大小和边框宽度** (自5.0起,ADR-0027)——一个数字, `'Npx'` 或者说 负数 `width`编号 :`height` 及其分数/分数, `flexBasis`,块/内置 大小; 打开 `border*Width`, (中文(简体) ), `outlineWidth`, (中文(简体) ), `outlineOffset`; 宽度 内置 a `border*` 或者说 `outline` 缩写字符串。 每个财产都来自 其候选人:人数 `sizes.*`; 边宽 `borders.hairline / strong / accent`; 大纲宽度 \* `borders.focusRing`页:1 `borders.focusOffset / focusOffsetSm`5.2 候选人人数 属性轴: a `…W` 编号 : `…MinW` 编号 : `…MaxW` 符号只提供于 a 宽度属性, a `…H` 编号 : `…MinH` 编号 : `…MaxH` 只在一高一高处 二者的无后缀符号(`flexBasis` (用两个) 有一场比赛建议 (负为 `calc(-1 * …)`)),数个分别给出一个建议. 无时 匹配,信件名称为 **最近的动作**: 每根同轴符号 ±10%范围内的最近值(`width: 232` → `sizes.gridColSm`, (中文(简体) ), `sizes.sidebarW`, (中文(简体) ), `sizes.popoverWSm` (240)),两个价值相等时 两者都列出,先缩小。 只有在没有那么接近的时候 上面写着要加个符号 A 类 `calc()` 或模板文字,其静态文本 持有px的报告.
    
-   **`boxShadow` 在模板文字中** (自5.2起)——其px长度为: 静态文本( e)`` `inset 0 0 0 1px ${colors.border}` ``)是生阴影;使用 (单位:千美元) `shadows.*` 符号 .
    
-   **微间距** - 离标间隔为1/2/3/5/6px `microSpacing.pxN`。 。 。 .
    

允许 : `0`相对单位(`%`, (中文(简体) ), `vh`, (中文(简体) ), `fr`, (中文(简体) ), `em`, (中文(简体) ), `rem`, (中文(简体) ), `ch`...),关键词 (单位:千美元)`auto`, (中文(简体) ), `max-content`),标识符和成员表达式(tokens),a `calc()` 以示纪念。 故意跳过: 间隔属性的负数, `'opacity 150ms'`\- 类型过渡和职位`top`, (中文(简体) ), `left`和 `lineHeight`自3.0起,它作为 `error`: 一个原始值是漂移 设计系统存在以停止.

**简称** (自5.7起) (中文(简体) ). 间隔或半径字符串, 有多个单词 (单位:千美元)`padding: '4px 8px'`, (中文(简体) ), `gap: '8px 16px'`)在白空间和每个空间上分割 检查非零 px 单值为: `'4px 8px'` 给两个 报告, `'6px 14px'` 给 `rawMicroSpacing` 财务报告和审定财务报表 `offScaleSpacing`。 。 。 . `0`, (中文(简体) ), `auto`, (中文(简体) ), `%`, (中文(简体) ), `rem`, (中文(简体) ), `em`, (中文(简体) ), `var(...)` 财务报告和审定财务报表 `calc(...)` 语出相传. 简称 报告载 **无建议**因为交换一个字会改写 整个字符串; 信件为每个单词命名符号 .

**内嵌样式** (自5.7起) (中文(简体) ). A 类 `style={{ ... }}` 任何 JSX 上的对象字元 元素读取为 `css.create` 样式,所以是原始颜色,字体大小,重量, 以简写方式报告计量或px。 这些报告载有: **没有 建议**,因为纯反应代码没有 `.css.ts` 符号导入 信件仍然为符号命名 . `style={styles.x}`、数组、标识符和 扩展被忽略,自定义属性密钥也被忽略(`'--wb-vw': '12px'`和 计算键。 设定 `inlineStyle: false` 把它关掉.

选项 : `{factories?: string[], spacingProperties?: string[], radiiProperties?: string[], exemptFiles?: string[], inlineStyle?: boolean}` (财产列表取代了默认,它们不合并). `inlineStyle` 默认为 `true`。 。 。 . `exemptFiles` 带 阴影( g)`**`, (中文(简体) ), `*`, (中文(简体) ), `?`, (中文(简体) ), `{a,b}`,与路径相对比对 工作目录和绝对路径; 未检查匹配文件 。 名称 只有一个文件,其字面意思是技术,而不是设计值——杜罗名 它的隐形模块.

### 无线层值

从 5.3. 内部 `css.create()` 对象 :

-   **`zIndex`** 数字或数字字符串 `0` 和负数。 A 类 层值表示它的符号(`zIndex: 1000` → `layers.overlay`, (中文(简体) ), `1050` → `layers.popup`; 任何其他值名称它所坐落的地层,没有 固定( e)`zIndex: 16` \* 之间 `layers.raised` (1)和 `layers.floating` 联合国. 自5.4起,从 `2` 最多 `localMax` (默认) `9`未报告 : 它命令儿童在一个组成部分内,这个组成部分不是一层(`1` 实值 `layers.raised` 并保留其建议).
-   **`backdropFilter` 编号 : `filter`** a 包括: `blur(...)` 字义. `blur(2px)` 建议 `effects.overlayBlur`, (中文(简体) ), `blur(6px)` 第5.4条 `effects.surfaceBlur`· ; 又一个模糊的报告,没有固定.

它的船作为 **`warn` 用于5.x行**所以,没有消费者的花 变成红色在一 并成为 **`error` 下一个主要项目**这是它自己的规则 从 `no-raw-design-values`,因为ESLint设定了每个规则的严厉性.

不报告本地堆放是规则的范围,而不是豁免 ADR-0027:z指数不是衡量标准之一 `design-system.every-measure-is-a-token` 制作一个符号(相距、半径、大小, 边框宽度). `localMax` 上限为 `49`,以下数字 `layers.floating` (50个),所以 跳跃从未达到一层; `{localMax: 0}` 报告每一个积极价值.

选项 : `{factories?: string[], exemptFiles?: string[], localMax?: number}`

### 无断点平滑

在文件的任何地方,一个媒体-克赖克字符串—— `useMediaQuery('(min-width: 768px)')`, (中文(简体) ), `matchMedia(...)`,一个常数——带有一个原始断点 `no-raw-design-values` 永不见(只读作: `css.create`) (中文(简体) ). 在规模上 自动修正字元重写为 `` `(min-width: ${breakpoints.md})` `` 财务报告和审定财务报表 添加导入(a) `css.defineConsts` 字符串,所以它插到 `'768px'`),其报告的规模外. 跳过 `css.create` 键,然后跳过 当一个本地 `breakpoints` 绑定会阴影导入 .

## 存储数据

规则数据(深路径图、间隔/辐射/断点px值、字体) 尺寸和重量、阴影、持续时间、放松、彩色调色板)为镜像 从 `@duro-app/tokens` 作为文字, 所出版的插件将保留 无依赖性. `test/token-drift.test.ts` 从真实中重建每个表格 符号包和漂移时的 CI 失败 .

仅 `test/` 进口 `@duro-app/tokens`· ; `src/` 从来没有。 词根 `prepare` 脚本依赖于此: 它以并行方式构建此插件和令牌包 (单位:千美元)`pnpm --no-sort`) (中文(简体) ). 若为 `src/` 曾进口 `@duro-app/tokens`减少 `--no-sort` ,或者一个新安装可以在读取符号之前构建插件 .

## 常见问题

### @duro-app/eslint-plugin 是什么？

ESLint 执行 Duro 设计系统常规的规则: react-strict-dom html\. \* 元素,深符号导入,符号值高于生px/hex,没有被贬值的表部分\.

### 如何安装 @duro-app/eslint-plugin？

在项目目录运行 npm install @duro-app/eslint-plugin，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：eslint（^9\.0\.0 \|\| ^10\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @duro-app/eslint-plugin 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @duro-app/eslint-plugin 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @duro-app/eslint-plugin 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js ^18\.18\.0 \|\| ^20\.9\.0 \|\| \>=21\.1\.0。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @duro-app/eslint-plugin 可以商用吗？

@duro-app/eslint-plugin 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @duro-app/eslint-plugin 的下载量有多少？

根据 npm 官方下载统计，@duro-app/eslint-plugin 在 2026/10/13 – 2026/11/11 这 30 天内被下载 7,064 次，日均约 235 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @duro-app/eslint-plugin 还在维护吗？

最新版本 6\.1\.0 发布于 2026/11/12（1 天前）；至今共发布 80 个版本，其中过去 12 个月发布了 80 个；首次发布于 2026/08/12。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。