@tiagoporto/eslint-config

Shareable Config for ESlint.

Linted files

• Javascript - .js,.mjs, .cjs and <script>.

• Typescript - .ts.

• JavaScript XML - .jsx and .tsx.

• HTML - .html and html in template literal strings (necessary comment).

  const code = /* html */ `<img class="image">`

• YAML - .yml, and .yaml.

• Json - .json, .jsonc and .json5.

• Markdown - .md, .markdown, .mdx and code blocks.

Includes

• @eslint-community/eslint-plugin-eslint-comments
• @eslint-react/eslint-plugin
• @eslint/js
• @eslint/json
• @html-eslint/eslint-plugin
• @stylistic/eslint-plugin
• eslint-plugin-html
• eslint-plugin-import-x
• eslint-plugin-jsdoc
• eslint-plugin-jsx-a11y
• eslint-plugin-mdx
• eslint-plugin-n
• eslint-plugin-promise
• eslint-plugin-react-hooks
• eslint-plugin-unicorn
• eslint-plugin-yml
• typescript-eslint

Installation

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

Usage

configs

base

// eslint.config.mjs
import tpConfig from '@tiagoporto/eslint-config'

/** @type {import('eslint').Linter.Config[]} */
export default [...tpConfig.configs.base]

base type-checked

// eslint.config.mjs
import tpConfig from '@tiagoporto/eslint-config'

/** @type {import('eslint').Linter.Config[]} */
export default [
  ...tpConfig.configs.baseTypeChecked,
  {
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.json']
      }
    }
  }
]

Requires tsconfig.json with include set.

react

// eslint.config.mjs
import tpConfig from '@tiagoporto/eslint-config'

/** @type {import('eslint').Linter.Config[]} */
export default [...tpConfig.configs.react]

react type-checked

// eslint.config.mjs
import tpConfig from '@tiagoporto/eslint-config'

/** @type {import('eslint').Linter.Config[]} */
export default [
  ...tpConfig.configs.reactTypeChecked,
  {
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.json']
      }
    }
  }
]

NPM scripts

// package.json
{
  "scripts": {
    "lint": "eslint --max-warnings 0",
    "lint:fix": "npm run lint -- --fix"
  }
}

Lefthook

Check staged files

# .lefthook.yml
pre-commit:
  parallel: true
  commands:
    markdown-lint:
      glob: '*.{md,markdown,mdx}'
      run: pnpm exec eslint --max-warnings 0 --no-warn-ignored {staged_files}

    html-yml-json-lint:
      glob: '*.{html,yml,yaml,json,jsonc,json5}'
      run: pnpm exec eslint --max-warnings 0 --no-warn-ignored {staged_files}

    js-ts-eslint:
      glob: '*.{js,mjs,cjs,jsx,ts,mts,cts,tsx}'
      run: pnpm exec eslint --max-warnings 0 --no-warn-ignored {staged_files}

Prettier

To avoid conflicts with Prettier, ignore the following files:

# .prettierignore
**/*.js
**/*.mjs
**/*.cjs
**/*.jsx
**/*.ts
**/*.tsx

Editor

For VSCode is recommended the following extensions:

• ESLint

// .vscode/settings.json
{
  "editor.codeActionsOnSave": {
    "source.fixAll": "explicit"
  },
  "editor.formatOnSave": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "html",
    "mdx",
    "vue",
    "markdown",
    "json",
    "jsonc",
    "yaml",
    "github-actions-workflow"
  ]
}

License

@tiagoporto/eslint-config © 2025 by Tiago Porto is licensed under MIT License.