🚀 Feature: Compatibility layer for ESLint plugins

[JoshuaKGoldberg]

👋 again! This and https://github.com/Quramy/typescript-eslint-language-service are two really exciting avenues of being able to run ideally much faster typed linting as a part of the TypeScript language service. Ideally we'd be able to run all of a project's linting through this one - including existing ESLint plugins.

One issue that plagued TSLint back in the day was that it didn't support ESLint plugins natively. Everything had to be rewritten from ESTree to TypeScript's AST format.

Would you be interested in some kind of compatibility layer that lets folks natively use ESLint rules and plugins in TSSLint?

Vaguely guessing at an initial API design:

import { defineConfig, eslintPluginCompat } from '@tsslint/config';
import example from 'eslint-plugin-example';

export default defineConfig({
	rules: {
		// ...
		eslintPluginCompat(example.recommended),
	},
});

It looks like ./packages/eslint already has a convertRule that does a lot of this work - so maybe this is already planned? 🙂

[johnsoncodehk]

Hey 👋 Thanks for the suggestion, I did plan to add this API but I'm very new to ESLint hence the delay. (I would appreciate it if you could share a repo suitable for testing this API.)

[JoshuaKGoldberg]

Swell! I've got a couple on my personal account that exercise some edge cases:

• https://github.com/JoshuaKGoldberg/eslint-plugin-expect-type: uses more TypeScript tooling than most
• https://github.com/JoshuaKGoldberg/eslint-plugin-package-json: made to work on .json files

https://github.com/eslint/eslint/issues/18093 is a good tracking issue to see plugins that support ESLint's new flat config format.

[johnsoncodehk]

~~1.0.14~~ 1.2.0 added the ~~loadPluginRules~~ convertConfig API in @tsslint/eslint, which is not a complete compatibility layer yet.

Example

import { defineConfig } from '@tsslint/config';
import { loadPluginRules } from '@tsslint/eslint';

export default defineConfig({
	rules: {
		...convertConfig(((await import('eslint-plugin-expect-type')).configs).recommended.rules),
		...convertConfig(((await import('@typescript-eslint/eslint-plugin')).default.configs).recommended.rules ?? {}),
	},
});

Or:

import { defineConfig } from '@tsslint/config'
import { convertConfig } from '@tsslint/eslint'

export default defineConfig({
  rules: convertConfig({
    '@typescript-eslint/no-misused-promises': 'warn',
    '@typescript-eslint/no-unsafe-argument': 'warn',
    '@typescript-eslint/no-unsafe-assignment': 'warn',
    '@typescript-eslint/no-unsafe-member-access': 'warn',
    '@typescript-eslint/no-unsafe-return': 'warn',
    '@typescript-eslint/no-unsafe-enum-comparison': 'warn',
    '@typescript-eslint/no-floating-promises': 'warn',
  }),
});

Since some plugin config has the extends option, implementing the eslintPluginCompat API need more considerations.

[johnsoncodehk]

I find that the convertConfig API is sufficient to cover current use cases, since people mainly use TSSLint to add type-aware rules, full compatibility with ESLint config doesn't make much sense to people, instead it may make TSLint config lose clarity.

If you need to completely convert a ESLint config, you can refer to https://github.com/vuejs/core/pull/12497.