eslint-plugin-antd-feedback

用于约束 Ant Design 静态反馈 API 的 ESLint 插件。当前提供 no-static-feedback-api 规则，避免静态 message、notification 和 Modal 方法脱离 React Context。

安装

pnpm add -D eslint-plugin-antd-feedback

该插件要求 ESLint 9.0.0 或更高版本，并使用 ESLint flat config。

推荐配置

import antdFeedback from 'eslint-plugin-antd-feedback';
import { defineConfig } from 'eslint/config';

export default defineConfig([
  ...antdFeedback.configs.recommended,
]);

推荐配置会以 error 级别启用 antd-feedback/no-static-feedback-api。

手动配置

import antdFeedback from 'eslint-plugin-antd-feedback';

export default [
  {
    plugins: { 'antd-feedback': antdFeedback },
    rules: {
      'antd-feedback/no-static-feedback-api': 'error',
    },
  },
];

no-static-feedback-api

禁止直接使用以下 Ant Design 静态反馈 API：

• 从 antd 导入的 message
• 从 antd 导入的 notification
• Modal.confirm、Modal.error、Modal.info、Modal.success 和 Modal.warning
• 通过 import * as antd 访问的对应 API

Modal 组件和 Modal.useModal() 不受限制。反馈实例可通过 App.useApp() 获取，也可通过 Modal.useModal() 获取带有 contextHolder 的 modal 实例。

示例

import { App, Modal } from 'antd';

const { message, notification, modal } = App.useApp(); // 允许
const [hookModal, contextHolder] = Modal.useModal(); // 允许

message.success('操作完成'); // 允许
notification.info({ message: '处理进度' }); // 允许
modal.confirm({ title: '确认操作' }); // 允许
hookModal.warning({ title: '注意' }); // 允许

Modal.confirm({ title: '确认操作' }); // 报错

选项

| 选项 | 默认值 | 说明 | | --- | --- | --- | | modal | true | 检查 Modal 静态反馈方法；传入 false 时关闭 | | message | true | 检查 message 导入与命名空间访问；传入 false 时关闭 | | notification | true | 检查 notification 导入与命名空间访问；传入 false 时关闭 |

每个选项可传入布尔值，也可通过对象中的 message 设置自定义提示文案。提示文案支持 {{name}} 占位符：

import antdFeedback from 'eslint-plugin-antd-feedback';

export default [
  {
    plugins: { 'antd-feedback': antdFeedback },
    rules: {
      'antd-feedback/no-static-feedback-api': [
        'error',
        {
          modal: {
            message: '禁止使用 Modal.{{name}} 静态方法，请改用上下文中的 modal 实例。',
          },
          message: true,
          notification: false,
        },
      ],
    },
  },
];

不传入选项时，所有检查默认启用。

开发

corepack pnpm install
corepack pnpm check

发布前可检查实际打包内容：

npm pack --dry-run