Twoslash ESLint

This package provides a ESLint-backed Twoslasher runner. Instead of checking for types, it converts ESLint diagnostics into Twoslash compatible interface and present ESLint warning and errors.

For example:

const 
unused
 = 1

type 
Foo
 = {
  bar: string
}

Installation

npm

npm i -D twoslash-eslint

pnpm

pnpm i -D twoslash-eslint

yarn

yarn add -D twoslash-eslint

bun

bun add -D twoslash-eslint

Usage

import { createTwoslasher } from 'twoslash-eslint'

const code = `
console.log('Code to lint')
`

const twoslasher = createTwoslasher({
  // Provide the ESLint FlatConfig array here
  eslintConfig: [
    {
      files: ['**'],
      plugins: { /* ... */ },
      rules: { /* ... */ }
    }
  ]
})

const result = twoslasher(code, 'index.ts')

Usage with Shiki

If you are using @shikijs/twoslash and want to support both TypeScript Twoslash and ESLint TwoSlash, you can use the following code:

import { transformerTwoslash } from '@shikijs/twoslash'
import { createTwoslasher as createTwoslasherESLint } from 'twoslash-eslint'
import Shiki from '@shikijs/markdown-it'

const shikiPlugin = await Shiki({
  theme: 'vitesse-light',
  // Or any other integrations that support passing Shiki transformers
  transformers: [
    // This is for normal TypeScript Twoslash
    transformerTwoslash({
      explicitTrigger: /\btwoslash\b/,
    }),
    // Create another transformer, but with different trigger and ESLint twoslasher
    transformerTwoslash({
      explicitTrigger: /\beslint-check\b/,
      // Pass the custom twoslasher
      twoslasher: createTwoslasherESLint({
        eslintConfig: [
          // ESLint flat config items here
        ]
      }),
      // Use hover to render errors instead of inserting a error line
      // Up to your preference
      errorRendering: 'hover',
    }),
  ]
})

// @noErrors
import { transformerTwoslash } from '@shikijs/twoslash'
import { createTwoslasher as createTwoslasherESLint } from 'twoslash-eslint'
import Shiki from '@shikijs/markdown-it'

const shikiPlugin = await Shiki({
  theme: 'vitesse-light',
  // Or any other integrations that support passing Shiki transformers
  transformers: [
    // This is for normal TypeScript Twoslash
    transformerTwoslash({
      explicitTrigger: /\btwoslash\b/,
    }),
    // Create another transformer, but with different trigger and ESLint twoslasher
    transformerTwoslash({
      explicitTrigger: /\beslint-check\b/,
      // Pass the custom twoslasher
      twoslasher: createTwoslasherESLint({
        eslintConfig: [
          // ESLint flat config items here
        ]
      }),
      // Use hover to render errors instead of inserting a error line
      // Up to your preference
      errorRendering: 'hover',
    }),
  ]
})

And then you can have the following code in your markdown:

```ts twoslash
console.log('normal typescript twoslash')
```

```ts eslint-check
console.log('normal eslint twoslash')
```