埃斯林特配置

我共享的 ESLint 和 Pretier 项目配置

* * * * 由我制作 @abhijithvijayan (英语)

捐赠 : 付费页, (中文(简体) ), 帕特伦

它吗? 打开它 GitHub 图像 或者说 图文 关于它.

目录

• 特征
• 安装
• 使用量
• 其他配置
• 覆盖
• 带有 VS 代码
• 问题
  • QQ 错误
• 许可证

特征

配置默认包含这些插件 :

• 埃斯林特-插口-进口-x
• 埃斯林特-插头-jsx-a11y
• 埃斯林特- 插孔- prettier
• eslint- 插件反应
• eslint-plugin- react-hooks (英语)
• 类型标记- slint
• 埃斯林特-插头-n

安装

npm install --save-dev @abhijithvijayan/eslint-config

安装所需的对等依赖 :

npm install --save-dev eslint eslint-config-prettier eslint-plugin-import-x eslint-plugin-prettier globals prettier

对于TypeScript支持,也安装:

npm install --save-dev @typescript-eslint/eslint-plugin @typescript-eslint/parser typescript

对于反应支持,也安装:

npm install --save-dev eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks

对于Node.js支持,也安装:

npm install --save-dev eslint-plugin-n

使用量

此软件包使用 ESLint 软件包 平面配置 格式。 创建一个 eslint.config.js (或 eslint.config.mjs在工程根中的文件 :

import baseConfig from '@abhijithvijayan/eslint-config';

export default [
  ...baseConfig,
  // your overrides
];

其他配置

这个配置也暴露了 react, (中文(简体) ), node,以及 typescript 我经常使用的配置.

类型脚本

import typescriptConfig from '@abhijithvijayan/eslint-config/typescript';

export default [
  ...typescriptConfig,
  // your overrides
];

节点.js

与碱性配置(建议)结合使用:

import baseConfig from '@abhijithvijayan/eslint-config';
import nodeConfig from '@abhijithvijayan/eslint-config/node';

export default [
  ...baseConfig, // or typescriptConfig
  ...nodeConfig,
  // your overrides
];

反应

与碱性配置(建议)结合使用:

import baseConfig from '@abhijithvijayan/eslint-config';
import reactConfig from '@abhijithvijayan/eslint-config/react';

export default [
  ...baseConfig, // or typescriptConfig
  ...reactConfig,
  // your overrides
];

可选

• 要插入您的文件, 您可以在您的文件中添加以下脚本 package.json数字 :

  "scripts": {
      "lint": "eslint .",
      "lint:fix": "eslint . --fix"
  },
  

• 添加要忽略的文件/目录 eslint.config.js数字 :

  export default [
    {
      ignores: ['node_modules', 'dist', '.yarn', '.pnp.js'],
    },
    ...baseConfig,
  ];
  

覆盖

如果你想要推翻 eslint 或者说 prettier 设置中,您可以在您的 eslint.config.js 文件 :

import baseConfig from '@abhijithvijayan/eslint-config';

export default [
  ...baseConfig,
  {
    rules: {
      'no-console': 'off',
      'prettier/prettier': [
        'error',
        {
          bracketSpacing: true,
          printWidth: 120,
          semi: true,
          singleQuote: true,
          tabWidth: 4,
          trailingComma: 'all',
          useTabs: false,
        },
      ],
    },
  },
];

带有 VS 代码

要显示编辑器的错误, 您需要配置您的编辑器 .

1. 安装 ESLint 软件包

2. 安装 高级软件包

3. 现在我们需要通过 Code/File → Preferences → Settings。编辑时更容易输入这些设置 settings.json 文件,单击 {} 右上角图标:

   "editor.formatOnSave": true,
   "[javascript]": {
     "editor.formatOnSave": false
   },
   "[javascriptreact]": {
     "editor.formatOnSave": false
   },
   "[typescript]": {
     "editor.formatOnSave": false
   },
   "[typescriptreact]": {
     "editor.formatOnSave": false
   },
   "editor.codeActionsOnSave": {
       "source.fixAll": "explicit",
       "source.fixAll.eslint": "explicit"
   },
   "prettier.disableLanguages": ["javascript", "javascriptreact", "typescript", "typescriptreact"],
   

问题

想做贡献吗? 寻找 好,第一个问题 标签.

QQ 错误

请提交一个问题 这里 对于错误,缺少文档,或意外行为.

见臭虫

类型脚本配置

• 共享类型脚本配置 - @abhijithvijayan/tsconfig

许可证

麻省理工学院 阿比吉斯·维贾扬