# @figma/eslint-plugin-figma-plugins 中文文档

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

版本：1\.0\.0
npm 元数据更新时间：2026-09-10T19:34:31.635Z
中文译文更新时间：2026-11-14T17:29:44.435Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40figma/eslint-plugin-figma-plugins
原文对照：https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/?lang=original
项目主页：https://github.com/figma/eslint-plugin-figma-plugins#readme
源码仓库：https://github.com/figma/eslint-plugin-figma-plugins

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

- 包体积（解压后）：53.4 kB，25 个文件
- 模块格式：CommonJS
- TypeScript 类型：包内自带
- 运行依赖：3 个
- 首次发布：2024-02-08T21:19:10.591Z
- 最新版本发布：2025-12-18T20:10:21.313Z
- 近 30 天下载量：122868（2026-10-15 至 2026-11-13，npm 官方下载统计）
- 已发布版本数：9（近 12 个月 1 个）

## 中文简介

用于 Figma 插件开发的 typescript-eslint 规则

## 安装

```sh
npm install @figma/eslint-plugin-figma-plugins
```

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

## README

# 埃斯林特-插头-菲克马-插头

此寄存器定义 [类型标记- slint](https://typescript-eslint.io/) 规则 [图像插件开发](https://www.figma.com/plugin-docs/)。 。 。 .

此工具有助于您及时掌握 Figma 插件 API 中的最佳做法并进行贬值 。 您可以用它来帮助识别并在许多情况下自动修复插件代码中的出问题. 与任何ESLint插件一样,它与VSCode等IDE集成,提供内置警告和快取功能.

### 仔细看看

![An animation of VSCode quick fixes enabled by this plugin](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/vscode-quickfix.gif)

## 安装

### 依赖关系

这个linter需要TypeScript,ESLint,打字符-eslint,以及Figma插件API类型定义. 要安装所有这些, 请运行 :

```
npm install -D typescript eslint @figma/plugin-typings
```

对于带有遗产配置的ESLint 8:

```
npm install -D eslint@8 @typescript-eslint/parser@8 @typescript-eslint/eslint-plugin@8
```

对于 ESLint 9 有平面配置 :

```
npm install -D eslint@9 @typescript-eslint/parser@8 @typescript-eslint/eslint-plugin@8  typescript-eslint@8
```

默认的 Figma 插件模板使用这些依赖的旧版本, 因此可能需要编辑 `package.json` 手动获取更多最新版本. 我们专门测试了以下对等依赖的平面配置:

```
- `@typescript-eslint/eslint-plugin`: `8.48.1`
- `@typescript-eslint/parser`: `^8.48.1`
- `eslint`: `^9.39.1`
- `typescript-eslint`: `^8.48.1`
```

### 安装 ESLint 插件包

```
npm install -D @figma/eslint-plugin-figma-plugins
```

### 配置丝绸

基于您的 ESLint 版本选择配置方法 :

#### ESLint 9+ (Flat Config) (中文(简体) )

更新您的 ESLint 配置, 以创建一个 eslint- plugin- figma- plugins `eslint.config.mjs` 使用新文档 `defineConfig()` 函数(文档在此: [https://typescript-eslint.io/getting-started/#details 页面存档备份,存于互联网档案馆](https://typescript-eslint.io/getting-started/#details)(中文(简体) )

这里有个例子 `eslint.config.mjs` 能够实现 `recommended` 用于此插件的规则以及来自 `@eslint/js` 财务报告和审定财务报表 `typescript-eslint` 软件包 :

```javascript
import js from '@eslint/js';
import tseslint from 'typescript-eslint';
import * as figmaPlugin from '@figma/eslint-plugin-figma-plugins';
import { defineConfig } from 'eslint/config'

export default defineConfig(
  js.configs.recommended,
  tseslint.configs.recommended,
  {
    files: ['**/*.ts'],
    languageOptions: {
      parser: tseslint.parser,
      parserOptions: {
        project: './tsconfig.json',
      },
    },
    plugins: {
      '@figma/figma-plugins': figmaPlugin,
    },
    rules: {
      ...figmaPlugin.flatConfigs.recommended.rules,
    },
  }
);
```

#### ESLint 8( 列克西配置)

将打字程序配置为普通 [这些指示](https://typescript-eslint.io/getting-started/legacy-eslint-setup)。 。 。 .

接下来更新您的 ESLint 配置 `extends` 阵列包含 `plugin:@figma/figma-plugins/recommended` 规则。 我们还建议采用下列规则:

-   `eslint:recommended`, (中文(简体) ),
-   `plugin:@typescript-eslint/recommended`

要使用 TypeScript 代码工作,ESLint 还需要以下解析器设置:

```
{
  ...
  parser: '@typescript-eslint/parser',
  parserOptions: {
    project: './tsconfig.json',
  },
  ...
}
```

这里有一个完整的例子 `.eslintrc.js`数字 :

```
/* eslint-env node */
module.exports = {
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:@figma/figma-plugins/recommended',
  ],
  parser: '@typescript-eslint/parser',
  parserOptions: {
    project: './tsconfig.json',
  },
  root: true
}
```

### 重新启动 ESLint 服务器

如果你已经跑 `npm install` 并更新到此软件包的更新版本, 请记住重新启动您的 IDE 。 在VSCode中,您可以通过打开命令调色板并选择"重新启动ESLint Server"来独立重启ESLint服务器.

## 使用量

### 固定和自动固定

通过运行,您可以使用这些规则插入您的项目

```
npx eslint ./path/to/source
```

一些规则提供了自动修正,您可以使用 `--fix`。 。 。 .

```
npx eslint --fix ./path/to/source
```

自动修补也通过一些IDE提供.

### 虚拟系统

要使用 VSCode 的 ESLint,请参见 [ESLint VSCode 扩展](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)。此扩展将显示规则的内在违反,并为直接运行IDE中的自定义提供机会.

## 可用的配置

此插件提供了两种配置 :

-   **`recommended`**: 包括所有规则 -- -- 断开更改时出错,以及警告咨询
-   **`recommended-problems-only`**: 仅包含断开更改、省略警告的错误级别规则

对于平面配置, 使用 :

-   `figmaPlugin.flatConfigs.recommended`
-   `figmaPlugin.flatConfigs['recommended-problems-only']`

对于遗产配置, 使用 :

-   `plugin:@figma/figma-plugins/recommended`
-   `plugin:@figma/figma-plugins/recommended-problems-only`

## 规则

QQ 配置启用 .  
QQ 配置设置为警告 .  
设置在 `recommended` 配置 .  
设置在 `recommended-problems-only` 配置 .  
自动修复 [`--fix` CLI 选项](https://eslint.org/docs/user-guide/command-line-interface#--fix)。 。 。 .

| 名称                                                         | 说明 | 💼 | ⚠️ | 🔧 |
| :-- | :-- | :-- | :-- | :-- |
| [等待- 要求- 同步](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/await-requires-async.md) | 需要包含 `await` 将会是 `async` | 👍 |  | 🔧 |
| [已禁用已禁用段落](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/ban-deprecated-id-params.md) | 禁止使用已贬值的字符串ID参数 | 👍 |  | 🔧 |
| [禁用解禁同步方法](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/ban-deprecated-sync-methods.md) | 禁止使用贬值的同步方法 | 👍 |  | 🔧 |
| [ban-depressed-sync-prop-geters 禁用设备](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/ban-deprecated-sync-prop-getters.md) | 禁止使用贬值的同步财产获取器 | 👍 |  | 🔧 |
| [禁用- 减用- 同步- 工具](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/ban-deprecated-sync-prop-setters.md) | 禁止使用贬值的同步财产获取器 | 👍 |  | 🔧 |
| [限制比例 -- -- 逐一替换 -- -- 标的 -- -- 比例 -- -- 咨询](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/constrain-proportions-replaced-by-target-aspect-ratio-advice.md) | 警告不要使用限制 偏好目标 |  | 👍 |  |
| [动态页面-文档更改-事件-咨询](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/dynamic-page-documentchange-event-advice.md) | 关于使用 `documentchange` 事件 |  | 👍 |  |
| [动态页面查找方法咨询](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/docs/rules/dynamic-page-find-method-advice.md) | 关于使用发现\*()方法系列的咨询 |  | 👍 |  |

### 捐款

请看 [捐款额](https://npmcn.com/package/%40figma/eslint-plugin-figma-plugins/CONTRIBUTING.md)

## 常见问题

### @figma/eslint-plugin-figma-plugins 是什么？

用于 Figma 插件开发的 typescript-eslint 规则

### 如何安装 @figma/eslint-plugin-figma-plugins？

在项目目录运行 npm install @figma/eslint-plugin-figma-plugins，或使用 pnpm add / yarn add / bun add。

### @figma/eslint-plugin-figma-plugins 支持 TypeScript 吗？

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

### @figma/eslint-plugin-figma-plugins 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @figma/eslint-plugin-figma-plugins 可以商用吗？

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

### @figma/eslint-plugin-figma-plugins 的下载量有多少？

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

### @figma/eslint-plugin-figma-plugins 还在维护吗？

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