ivanhofer / sveltekit-typescript-showcase

This repository shows how Svelte and SvelteKit work together with TypeScript.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Linting sveltekit

thenbe opened this issue · comments

It's very hard to find material of this quality, let alone have it be succinct and structured such that it is easily digested. You can immediately tell that a lot of work has been put into it. So thank you for sharing this.

I noticed that you didn't really talk about eslint, and was wondering if that was because (a) the default eslint config in good enough or (b) because linting is an entirely different beast. TBH, I'm kinda hoping the answer is (a). In the past, I've tried adding all sorts of eslint plugins to increase type-safety/encourage best practices (airbnb, etc) to my projects, but could never really make them click with sveltekit.

I know some plugins & rules are known to conflict with svelte, but even without those, I've always had weird quirks with eslint + sveltekit. For example, depending on whether I use svelte-check or yarn run eslint, different rules and different files would get linted. And I'm pretty sure I now have PTSD from the time I listened to an eslint prompt that said I should set parserOptions.project. Anyways, if you have the time to share any config (tips) it'll be very much appreciated. Otherwise, you've already done more than enough.

TLDR; Would you recommend adding anything (plugins, etc) to the default eslint config?

Thanks @ambiguous48!

I haven't included eslint and prettier because this repo should only focus on the TypeScript specifics.
Configuring eslint the way you want is not always easy. Especially with the combination of TypeScript.
But SvelteKit makes this easy by offering a basic template. You can run npm init svelte@next or just copy it from the official repo: https://github.com/sveltejs/kit/blob/master/packages/create-svelte/shared/%2Beslint%2Bprettier%2Btypescript/.eslintrc.cjs

On top of the default configuration you can add or disable any rule by adding rules to the config.

I have added a few rules and it works fine for my projects.