Set Up TypeScript ESLint with Type-Aware Rules

Beginner10 minTrending

Configure ESLint with typescript-eslint for type-aware linting rules that catch bugs the compiler misses, including no-floating-promises and consistent-type-imports.

Prerequisites

-TypeScript project with tsconfig.json

Steps

Install typescript-eslint

Add ESLint and typescript-eslint packages for flat config support.

$ pnpm add -D eslint @eslint/js typescript-eslint

Create eslint.config.mjs with type-aware rules

Set up a flat config that enables type-checked linting rules.

$ cat > eslint.config.mjs << 'EOF' import eslint from '@eslint/js'; import tseslint from 'typescript-eslint'; export default tseslint.config( eslint.configs.recommended, ...tseslint.configs.strictTypeChecked, ...tseslint.configs.stylisticTypeChecked, { languageOptions: { parserOptions: { projectService: true, tsconfigRootDir: import.meta.dirname, }, }, }, { rules: { '@typescript-eslint/no-floating-promises': 'error', '@typescript-eslint/consistent-type-imports': 'error', '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }], }, }, { ignores: ['dist/', 'node_modules/', '*.config.*'] }, ); EOF

Use strictTypeChecked for maximum safety. Fall back to recommendedTypeChecked if strict has too many errors initially.

Run the linter

Execute ESLint across all TypeScript files and review errors.

$ npx eslint . --max-warnings=0

Add a lint script and fix command

Add convenient npm scripts for linting.

$ npm pkg set scripts.lint='eslint .' scripts.lint:fix='eslint . --fix'

Full Script

full-script.sh

#!/bin/bash
# TypeScript ESLint Setup
set -euo pipefail

echo "=== Installing dependencies ==="
pnpm add -D eslint @eslint/js typescript-eslint

echo "=== Creating eslint.config.mjs ==="
cat > eslint.config.mjs << 'EOF'
import eslint from '@eslint/js';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.strictTypeChecked,
  ...tseslint.configs.stylisticTypeChecked,
  {
    languageOptions: {
      parserOptions: {
        projectService: true,
        tsconfigRootDir: import.meta.dirname,
      },
    },
  },
  {
    rules: {
      '@typescript-eslint/no-floating-promises': 'error',
      '@typescript-eslint/consistent-type-imports': 'error',
      '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
    },
  },
  { ignores: ['dist/', 'node_modules/', '*.config.*'] },
);
EOF

echo "=== Adding scripts ==="
npm pkg set scripts.lint="eslint ."
npm pkg set scripts.lint:fix="eslint . --fix"

echo "=== Running linter ==="
npx eslint . --max-warnings=0

FAQ

Discussion

Loading comments...

#!/bin/bash # TypeScript ESLint Setup set -euo pipefail echo "=== Installing dependencies ===" pnpm add -D eslint @eslint/js typescript-eslint echo "=== Creating eslint.config.mjs ===" cat > eslint.config.mjs << 'EOF' import eslint from '@eslint/js'; import tseslint from 'typescript-eslint'; export default tseslint.config( eslint.configs.recommended, ...tseslint.configs.strictTypeChecked, ...tseslint.configs.stylisticTypeChecked, { languageOptions: { parserOptions: { projectService: true, tsconfigRootDir: import.meta.dirname, }, }, }, { rules: { '@typescript-eslint/no-floating-promises': 'error', '@typescript-eslint/consistent-type-imports': 'error', '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }], }, }, { ignores: ['dist/', 'node_modules/', '*.config.*'] }, ); EOF echo "=== Adding scripts ===" npm pkg set scripts.lint="eslint ." npm pkg set scripts.lint:fix="eslint . --fix" echo "=== Running linter ===" npx eslint . --max-warnings=0