TypeScript warnings

#javascript #eslint #typescript

I really don't like the way JavaScript / TypeScript works with unused variables.

I guess unused variables, constants and imports should be underlined by default.

I mean by default, so you don't have to configure it manually:

package.json

{
  "type": "module",
  "devDependencies": {
    "@types/node": "^25.5.2",
    "@typescript-eslint/eslint-plugin": "^8.58.0",
    "@typescript-eslint/parser": "^8.58.0"
  }
}

eslint.config.js

export default [
  {
    files: ["**/*.ts"],
    languageOptions: { ecmaVersion: 2021, sourceType: "module" },
    rules: {
      "no-unused-vars": [
        "warn",
        { vars: "all", args: "after-used", ignoreRestSiblings: true },
      ],
    },
  },
];

{Updated on 2026.04.04}

Rules for frontend (React TypeScript)

eslint.config.js

import js from "@eslint/js";
import globals from "globals";
import reactHooks from "eslint-plugin-react-hooks";
import reactRefresh from "eslint-plugin-react-refresh";
import tseslint from "typescript-eslint";
import { defineConfig, globalIgnores } from "eslint/config";

export default defineConfig([
  globalIgnores(["dist"]),
  {
    files: ["**/*.{ts,tsx}"],
    extends: [
      js.configs.recommended,
      tseslint.configs.recommended,
      reactHooks.configs.flat.recommended,
      reactRefresh.configs.vite,
    ],
    languageOptions: {
      ecmaVersion: 2020,
      globals: globals.browser,
    },
    rules: {

      // Disable the TS version (if it sets an error)

      "@typescript-eslint/no-unused-vars": "off",

      // Enable the base rule as a warning.

      "no-unused-vars": [
        "warn",
        { vars: "all", args: "after-used", ignoreRestSiblings: true },
      ],
      "prefer-const": ["warn"],
    },
  },
]);