@cybozu/slint-配置

赛博祖的ESLint规则.

此包意在Cybozu中使用. 目前,这仍在发展之中,以便改变规则.

这是什么?

这是赛博祖的ESLint规则. 目的 @cybozu/eslint-config 以下为

• 共享 JavaScript 的最佳做法
• 在 Cybozu 中将 JavaScript 编码指南标准化
• 对ESLint的安装支持和对规则集的持续支持

采用这一规则的好处

你不需要关心ESLint和ESLint插件的更新. 我们将管理更新 并提供 ChangeGELOG 这些你需要知道的 这样你就可以轻松更新它. 此外,我们将添加一些有用的插件到 @cybozu/eslint-config 这样您就可以通过 JavaScript 学习最佳做法 @cybozu/eslint-config。 。 。 .

制定规则的政策

我们提供错误或警告的规则.

错误

这是您必须修补的规则, 因为代码可能不会遵循我们在 JavaScript 中的做法

3⁄4 ̄ ̧漯B

这是一条规则,你应该修正 因为代码样式可能不可取.

版本政策

1. 如果修改可能造成新的错误,我们将更新主要版本.
2. 如果更改可能引起新的警告, 我们会更新小版本 .
3. 如果修改没有引起任何新的错误和警告,我们将会更新补丁版本.

如何使用

安装 eslint 财务报告和审定财务报表 @cybozu/eslint-config

% npm install --save-dev eslint @cybozu/eslint-config

预设使用的ESLint插件( 如 eslint-plugin-react-hooks 财务报告和审定财务报表 eslint-plugin-jsx-a11y-x)作为依附关系捆绑在一起 @cybozu/eslint-config,所以你不需要单独安装它们.

eslint.config.mjs

把它放进你的 eslint.config.mjs

import reactTypeScriptPrettier from "@cybozu/eslint-config/presets/react-typescript-prettier";

export default [
  ...reactTypeScriptPrettier,
  // You can add other presets as needed.
  // ...otherPresets
  {
    rules: {
      // You can also override individual rules.
    },
  },
];

说明: 目前,我们通过 @stylistic/indent 规则为 2 个空格并缩进 switch case。 。 。 . 如果您的项目采用4个空格或其他空格, 您可以推翻规则 . 我们认为,重要的是保持 整个代码库的一致性.

从v25或更早升级

从v26开始, @cybozu/eslint-config 仅支持 平面配置 (单位:千美元)eslint.config.mjs)并放弃了对遗留配置格式的支持(.eslintrc.js) (中文(简体) ).

如果你使用v25或更早,你需要:

• 将您的 ESLint 配置从 .eslintrc.js 改为 eslint.config.mjs
• 更新全部配置导入 @cybozu/eslint-config/flat/presets/* 改为 @cybozu/eslint-config/presets/*
• 更新导入自 @cybozu/eslint-config/flat/globals/kintone 改为 @cybozu/eslint-config/globals/kintone

见 ESLint 移徙指南 关于向平面配置迁移的细节.

除了平面配置迁移外,v26还包括以下断面变化.

ESLint 版本要求

此版本需要 ESLint v10 或稍后时间. ESLint v8和v9不再作为对等依赖支持. 在更新此软件包之前升级 ESLint .

节点.js版本要求

这个版本需要 Node.js v22 或更晚时。 。 。 .

反应规则更改

反应林特规则由 @cybozu/eslint-config 下划线 react/* 前缀,而不是 eslint-plugin-react. 注意如下:

• 仅函数组件: 不包括特定类别组成部分的规则。 如果您的工程使用类组件, 您可能需要手动配置附加规则 .
• 无障碍规则: 由 eslint-plugin-jsx-a11y-x 下划线 jsx-a11y-x/* 前缀。 如果你超过任何 jsx-a11y/* 配置中的规则或引用 eslint-disable 注释,将其更新至 jsx-a11y-x/* 前缀.
• JSX 格式规则: 由 @stylistic/eslint-plugin 下划线 @stylistic/* 前缀( 如 ). @stylistic/jsx-self-closing-comp) (中文(简体) ). 格式化规则不会被预设所允许,如果需要,也可以在那里使用.
• 需要新的 JSX 变换: 经典JSX变换(:react/jsx-uses-react)不支持。 项目必须使用 新的 JSX 变换。 。 。 .

其他规则更改

添加、去除或重新命名了各种其他规则(例如,已贬值的核心格式规则现在可以在 @stylistic/* 前缀). 如果超过规则或使用 eslint-disable 注释,在升级后审查新的警告和错误.

支持规则集

• @cybozu/eslint-config/presets/base
  • 包含在以下所有预设中
• @cybozu/eslint-config/presets/node
  • 包括 eslint-plugin-n
• @cybozu/eslint-config/presets/typescript
  • 包括 @typescript-eslint/eslint-plugin
• @cybozu/eslint-config/presets/react
  • 包括内置反应规则, eslint-plugin-react-hooks 财务报告和审定财务报表 eslint-plugin-jsx-a11y-x
  • eslint-plugin-react 不再需要作为受扶养人
• @cybozu/eslint-config/presets/react-typescript
  • 包括 @cybozu/eslint-config/presets/typescript 财务报告和审定财务报表 @cybozu/eslint-config/presets/react
• @cybozu/eslint-config/presets/es5
• @cybozu/eslint-config/presets/css-baseline
  • 使用 @eslint/css

高级支持

Prettier是一个用于物质的代码,它不仅支持JavaScript,还支持许多语言. Pretier被广泛用作JavaScript的代码.

虽然有观点,但我们不必与Prettier讨论代码风格,因为这是规则(不再自行车了).

以下预设可禁用所有与 Pretier 相冲突的规则,并将 Pretier 代码格式之间的差异视为出错 . 你可以通过 --fix 选项,所以不需要手动修正错误.

要使用预设,必须安装 prettier。我们只支持 Pretier v3 或以后的版本.

% npm install --save-dev prettier

• @cybozu/eslint-config/presets/prettier
• @cybozu/eslint-config/presets/node-prettier
• @cybozu/eslint-config/presets/node-typescript-prettier
• @cybozu/eslint-config/presets/typescript-prettier
• @cybozu/eslint-config/presets/react-typescript-prettier
• @cybozu/eslint-config/presets/react-prettier
• @cybozu/eslint-config/presets/es5-prettier

目前我们不支持定制的Pretier配置

对于 kintone 自定义开发者

我们还为自定义/插件开发者提供预设,其中包括一些 globals 给克通的.

使用量

// eslint.config.mjs
import kintoneCustomize from "@cybozu/eslint-config/presets/kintone-customize";

export default [...kintoneCustomize];

预设

• @cybozu/eslint-config/presets/kintone-customize
  • 预设自定义/插件开发
• @cybozu/eslint-config/presets/kintone-customize-prettier
  • 预设用于自定义/插入开发,包括 prettier 配置
• @cybozu/eslint-config/presets/kintone-customize-es5
  • 在ES5中预设自定义/插件开发
• @cybozu/eslint-config/presets/kintone-customize-es5-prettier
  • 在ES5中预设自定义/插入开发的光通 prettier 配置

用于 kintone 开发者

@cybozu/eslint-config/presets/kintone-dev 是一个附加的预设,它允许开发相通的自定义规则. 其中不包括 base,因此与另一个预设一起使用.

// eslint.config.mjs
import reactTypeScript from "@cybozu/eslint-config/presets/react-typescript";
import kintoneDev from "@cybozu/eslint-config/presets/kintone-dev";

export default [...reactTypeScript, ...kintoneDev];

见 插件/ 外观/ README. md 为了规则.