ESLint plugin Svelte Preprocessor

Purpose

It's a preprocessor to use with eslint-plugin-svelte3 to produce AST valid to the original code.

For now only TypeScript is supported but the idea is to add Coffeescript and Pug support, like the svelte-preprocess package.

Many thanks to Conduitry and her/his initial work on her/his fork.

Install

pnpm i -D eslint-svelte3-preprocess

Usage

After following the docs of eslint-plugin-svelte3 to configure your eslintrc.js file, you will need to add some props required by @typescript-eslint/parser and finally import your svelte.config file (if you would like to use the same configuration) and call the elint-plugin-svelte3-preprocess passing your autoPreprocessConfig as a parameter.

This is a example that works!

const eslintSveltePreprocess = require('eslint-svelte3-preprocess');
const svelteConfig = require('./svelte.config');

module.exports = {
    parserOptions: {
        ecmaVersion: 2019,
        sourceType: 'module',
    },
    parser: "@typescript-eslint/parser",
    env: {
        es6: true,
        browser: true
    },
    extends: [
        "eslint:recommended",
        "plugin:@typescript-eslint/recommended",
    ],
    plugins: [
        'svelte3',
        "@typescript-eslint",
    ],
    overrides: [
        {
            files: ['*.svelte'],
            processor: 'svelte3/svelte3',
        }
    ],
    settings: {
    	// This fork uses workers along with `deasync`
    	// The preprocesssor object contains functions, and cannot be cloned
    	// So just use the naked configuration option, you would pass into `svelte-preprocess`
        'svelte3/preprocess': eslintSveltePreprocess(svelteConfig.autoPreprocessConfig),
	},
};

Editor support

I only tested it on Visual Studio Code, but I guess it should be similar for other editors. If you find the way to solve it, I would appreciate your collaboration to improve this documentation.

Visual Studio Code

Having Svelte Beta and ESLint extensions, you need to add this to your configuration.

{
    "eslint.validate": [
    "svelte"
  ]
}