@ 1password/eslint- config

1Password的共享ESLint配置 :

• javascript: 对于香草JavaScript
• typescript: 用于类型脚本
• react: 用于反应 + 类型脚本
• disabled-formatting-rules:用于取消功能的 ESLint 格式化规则

开始

1. 导航您的项目的根 。 注意:根在您显示的地方(或 package.json)文件生命,这可以是子目录,也可以是您 repo 的根.

2. 使用您的工程的软件包管理器安装 @ 1password/eslint- config 和 ESLint :

pnpm add --save-dev @1password/eslint-config eslint

npm install --save-dev @1password/eslint-config eslint

yarn add --dev @1password/eslint-config eslint

3. 添加一个 eslint.config.mjs 文件,如果一个不存在:

touch eslint.config.mjs

4. 扩展您需要的 ESLint 配置 eslint.config.mjs 文档。 这个 typescript-eslint 软件包包含一个很好的 config 函数,帮助对扩展配置应用文件规则.

// Base config
import opLintConfig from "@1password/eslint-config";
// Alternatively, import `opLintConfig` from one of the other shared
// configurations listed above, according to the needs of your web project.
//
// For example, if your repo is a React project:
// import opLintConfig from "@1password/eslint-config/react";
import tseslint from "typescript-eslint";

export default tseslint.config({
    extends: [opLintConfig],
    files: ["src/**/*.ts"],
    // other settings
});

5. 如果需要,则在 ESLint 中禁用已折旧(但尚未删除)的格式规则,则在 typescript-eslint,并可能在 eslint-plugin-react,通过扩展关闭格式规则的配置:

import opLintConfig from "@1password/eslint-config";
import disabledFormattingRules from "@1password/eslint-config/disabled-formatting-rules";

// Base Config
export default tseslint.config({
    extends: [opLintConfig, disabledFormattingRules],
    // other settings
});

如果自定义配置不能禁用您工程中的所有格式化规则, 请看看您是否正在使用不包含在 @ 1password/ eslint- config 中的 ESLint 插件, 但包含在本列表中 :

  https://github.com/prettier/eslint-config-prettier#plugins 页面存档备份,存于互联网档案馆

如果您是, 您可以通过 eslint-config- prettier 而不是自定义配置关闭该插件的格式规则 .

自定义 ESLint 规则

您可以自定义 ESLint 配置, 方法是在您的 eslint.config.mjs 文档。 当您的项目有不同于默认设置的独特林入需求时,此功能是有用的 @1password/eslint-config。 。 。 .

1. 如果你的项目 不使用反应,扩展 @1password/eslint-config 并添加或推翻 rules示例:

import opLintConfig from "@1password/eslint-config";
import tseslint from "typescript-eslint";

export default tseslint.config({
    extends: [opLintConfig],
    rules: {
        "@typescript-eslint/switch-exhaustiveness-check": "error",
        "no-console": ["error", { allow: ["warn", "error"] }],
        // ...more rules
    },
});

2. 如果你的项目 使用反应,扩展 @1password/eslint-config/react 并添加或推翻 rules示例:

import opLintConfig from "@1password/eslint-config/react";
import tseslint from "typescript-eslint";

export default tseslint.config({
    extends: [opLintConfig],
    rules: {
        "react/react-in-jsx-scope": "off",
        "react/prop-types": "off",
        // ...more rules
    },
});

3. 如果您的项目需要额外的 ESLint 插件, 但不包含在内 @1password/eslint-config,分别安装,并在 eslint.config.mjs。例如,添加 eslint-plugin-vitest 页:1 Vitest 测试规则 :

pnpm add --save-dev eslint-plugin-vitest

那就更新你的 eslint.config.mjs 文件 :

import opLintConfig from "@1password/eslint-config/react";
import tseslint from "typescript-eslint";
import vitest from "eslint-plugin-vitest";

export default tseslint.config({
    extends: [opLintConfig],
    plugins: { vitest },
    rules: {
        "vitest/no-focused-tests": "error",
    },
});

配置格式

在ESLint v9中,默认的配置格式已经改为"平面配置",这就是你上面看到的. 见 文档 关于向新格式迁移的更多信息.

将 ESLint 与您的编辑器整合

如果您想要将 ESLint 集成到您的 IDE 或文本编辑器中, 以便您可以将您的 JavaScript 和 TypeScript 代码作为您的代码内嵌, 请访问

  https://eslint.org/docs/latest/use/institutions#editors (中文(简体) )

以查看当前支持哪些整合.

哲学

围绕这个一揽子方案的讨论,促使我们找出一种哲学来指导我们如何管理规则. 一揽子计划的现状可能无法完全实现这些理想.

1. 修改时必须考虑这个包的用意是用于1Password的每个TypeScript项目. 因此,改变不应该集中在某个特定项目的需要上,而应该尽量保持没有争议,同时考虑到数百人很少会完全同意任何事情.

2. 如果一套规则在JS/TS社区内得到广泛接受,则其建议的规则应予扩大(例如:. eslint.configs.recommended)),根据需要最小的覆盖. 见 ./internal/eslint.js 举个例子.

3. 如果一揽子规则中有一套建议的规则,其中含有相当一部分有争议的/优惠规则,则不应扩大这套规则。 启用个别规则,而不是允许一整套规则,然后使有争议的规则失效。 见 ./internal/sonar.js 举个例子.