Detect unused tss-react classes

This eslint plugin lets you detect unused tss-react classes:

https://user-images.githubusercontent.com/6702424/167231369-4eaeb5b2-bb39-4647-9911-086572c5e212.mov

Usage

1. Add the dependency:

npm i --D @yanngdev/eslint-plugin-tss-unused-classes

2. Enable it in your ESLint config

Case 1: You are in a create-react-app project:
Edit your package.json:

{
  //...
  "eslintConfig": {
    "plugins": [
      //...
      "tss-unused-classes"
    ],
    "rules": {
      "tss-unused-classes/unused-classes": "warn"
    }
  },
  //...
}

Example project

Case 2: You have a legacy ESLint config (ESLint < 9, .eslintrc.js):
Edit your .eslintrc.js file:

module.exports = {
  // ...
  plugins: [
    // ...
    'tss-unused-classes'
  ],
  rules: {
    // ...
    'tss-unused-classes/unused-classes': 'warn'
  }
}

Example project

Case 3: You are using the flat config (ESLint 9+, eslint.config.js or eslint.config.mjs):

import tssUnusedClasses from '@yanngdev/eslint-plugin-tss-unused-classes';

export default [
  // ...
  {
    plugins: {
      'tss-unused-classes': tssUnusedClasses
    },
    rules: {
      'tss-unused-classes/unused-classes': 'warn'
    }
  }
];

Or using CommonJS:

const tssUnusedClasses = require('@yanngdev/eslint-plugin-tss-unused-classes');

module.exports = [
  // ...
  {
    plugins: {
      'tss-unused-classes': tssUnusedClasses
    },
    rules: {
      'tss-unused-classes/unused-classes': 'warn'
    }
  }
];

Note: ESLint 10 also uses the flat config format. The eslint.config.js examples above are valid for both ESLint 9 and 10.

Disabling warnings

In case of false positive, disable the warning:

• For the next line: // eslint-disable-next-line tss-unused-classes/unused-classes
• For the entire file: /* eslint-disable tss-unused-classes/unused-classes */