@gsc-basic/eslint-config

ESlint Config for GSC Basic Team

DO NOT use it in your own project if you don't know what it's for

说明

基于 @antfu/eslint-config 构建。使用更加简单，旨在独立使用，无需 Prettier。

默认用于 TypeScript、Vue、Jsx、Unocss、JSON、YAML、Toml、Markdown等开箱即用。

可选 React 支持。

风格原则：Minimal for reading, stable for diff, consistent。

使用

ESLint v9.12.0+ is now required.

pnpm i -D eslint @gsc-basic/eslint-config

// eslint.config.mjs
import { gscEslint } from '@gsc-basic/eslint-config';

export default gscEslint();

// package.json
{
  "scripts": {
    "lint:eslint": "eslint \"{src,build,scripts,mock}/**/*.{vue,js,mjs,jsx}\" --fix"
  }
}

定制

• 您可以单独开启或关闭每个集成：

// eslint.config.mjs
import { gscEslint } from '@gsc-basic/eslint-config';

export default gscEslint({
  type: 'app', // lib or app, default: app
  unocss: true,
  jsx: true,
  vue: true,
  react: false,
  ignores: [], // 忽略的目录或文件

  // 还可以配置任意数量的任意自定义配置覆盖
  flatConfig: [
    {
      files: ['**/*.vue'],
      rules: {},
    },
    {
      rules: {},
    }
    // ...more
  ],

  // ----------------------------------------
  // 因本工具基于 @antfu/eslint-config 构建，所以也支持所有antfu的所有配置
  // !!! 可以覆盖任意预设配置，优先级最高，慎用。
  // ----------------------------------------
  antfu: {
    stylistic: {
      indent: 4, // 2, or 'tab'
      quotes: 'double', // or 'single'
    },
    typescript: false,
  }
});

Vue2支持

我们对 Vue 2 的支持有限（因为它已经 达到 EOL ）。如果您仍在使用 Vue 2，则可以通过设置为手动配置vueVersion: 2：

// eslint.config.mjs
import { gscEslint } from '@gsc-basic/eslint-config';

export default gscEslint({
  vue: {
    vueVersion: 2
  },
});

React支持

要启用 React 支持，您需要明确打开它：

// eslint.config.mjs
import { gscEslint } from '@gsc-basic/eslint-config';

export default gscEslint({
  react: true,
});

lint-staged支持

pnpm i lint-staged -D

// package.json
{
  "scripts": {
    "lint-staged": "lint-staged"
  },
  "lint-staged": {
    "*.{js,mjs,vue,jsx,json}": [
      "eslint --fix"
    ]
  }
}

# .husky/pre-commit

npm run lint-staged

echo Run pre-commit hook done.

VS code支持

安装 VS Code ESLint 扩展

// .vscode/settings.json
{
  // Enable the ESlint flat config support
  "eslint.useFlatConfig": true,

  // Disable the default formatter, use eslint instead
  "prettier.enable": false,
  "editor.formatOnSave": false,
  "editor.formatOnPaste": false,

  // Auto fix
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit",
    "source.organizeImports": "never"
  },

  // Silent the stylistic rules in you IDE, but still auto fix them
  "eslint.rules.customizations": [
    { "rule": "style/*", "severity": "off" },
    { "rule": "format/*", "severity": "off" },
    { "rule": "*-indent", "severity": "off" },
    { "rule": "*-spacing", "severity": "off" },
    { "rule": "*-spaces", "severity": "off" },
    { "rule": "*-order", "severity": "off" },
    { "rule": "*-dangle", "severity": "off" },
    { "rule": "*-newline", "severity": "off" },
    { "rule": "*quotes", "severity": "off" },
    { "rule": "*semi", "severity": "off" }
  ],

  // Enable eslint for all supported languages
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "vue",
    "html",
    "markdown",
    "json",
    "jsonc",
    "yaml",
    "toml",
    "gql",
    "graphql"
  ]
}