Uh oh!
There was an error while loading.Please reload this page.
- Notifications
You must be signed in to change notification settings - Fork2.8k
Community Feedback: Pain Points#6121
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
This discussion is intended to be a general thread where we can collect some feedback from users. We've recently seen some unstructured complaints and critiques in other repo discussions and on twitter - which is hard for us to action because we can't easily engage or collect more information in those places (off-topic spam or 140 character limit). Discussion threads here will let us organise a bit without forcing everyone to go through filing a new issue with a template. So please provide your feedback. Let us know what you find difficult about using TypeScript with ESLint. Please provide more than a sentence to help us understand. If you can add some examples that would be great. You don't need to think about or provide any solutions to the problem - leave that to us! (but feel free to provide them if you want!) We may not be able to respond to everyone, but be sure that every comment will be read by maintainers and will help us to improve the ecosystem. |
BetaWas this translation helpful?Give feedback.
All reactions
Replies: 13 comments 54 replies
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
The main annoyance for me is how typescript-eslint overrides lint rules that are part of the ESLint core rules itself. Our config has a bunch of definitions like this: module.exports={parser:"@typescript-eslint/parser",plugins:["@typescript-eslint"],// If adding a typescript-eslint version of an existing ESLint rule,// make sure to disable the ESLint rule here.rules:{// TypeScript's `noFallthroughCasesInSwitch` option is more robust (#6906)"default-case":"off",// 'tsc' already handles this (https://github.com/typescript-eslint/typescript-eslint/issues/291)"no-dupe-class-members":"off",// 'tsc' already handles this (https://github.com/typescript-eslint/typescript-eslint/issues/477)"no-undef":"off",// Add TypeScript specific rules (and turn off ESLint equivalents)"@typescript-eslint/consistent-type-assertions":"warn","no-array-constructor":"off","@typescript-eslint/no-array-constructor":"warn",// more of these…}} Note that this is based on an ejected But to me this shows there’s an inherent tension because of the fact that ESLint’s core doesn’t recognize TypeScript (hence the need for a custom parser) and its rules don’t either. This also leaks into the ecosystem, because when trying out some rule from NPM you often don’t know whether it’ll play nicely with TypeScript or not. If TypeScript support were first-class (see Deno or Rome), this would not be necessary. |
BetaWas this translation helpful?Give feedback.
All reactions
👍 2
-
We do have an existing config which turns off base ESLint rules that are already checked by TS (config docs,config contents) which should save you a bunch of config lines! As for the other issue of disabling core rules in favour of extension rules - yeah sadly that's just something that can only be truly fixed by ESLint code supporting TS syntax in linting so that we can do-away with extension rules entirely. Solutions I've mused about that don't work well/at all:
|
BetaWas this translation helpful?Give feedback.
All reactions
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment has been hidden.
This comment has been hidden.
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
For the authors of @typescript-eslint/prefer-for-of: |
BetaWas this translation helpful?Give feedback.
All reactions
-
I'm not quite sure how this is related to pain points - could you please elaborate? |
BetaWas this translation helpful?Give feedback.
All reactions
This comment was marked as off-topic.
This comment was marked as off-topic.
-
We have clear and explicit documentation on how we do versioning and what we consider a breaking change. https://typescript-eslint.io/users/versioning Changes to the recommended set are only done in a major. |
BetaWas this translation helpful?Give feedback.
All reactions
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
Here is some feedback: I used this library a while ago, but today I wasn't able to configure it again on a new project. The documentation assume you know eslint and therefore you are able to configure typescript-eslint. I thought the documentation would help getting started from scratch, but really you have to guess on how to plug it. Do you need a plugin? Do you need a different config file? Do you need to extend eslint configuration? After reading the whole documentation you realise that it won't tell you how to set it up and that these answers are hidden behind this vague title: I understand that it's not this documentation's job to explain how eslint works, but pinpointing mandatory steps or at least stating that eslint knowledge is required to go further would be great. |
BetaWas this translation helpful?Give feedback.
All reactions
-
Thanks@RemyMachado, that's good feedback! Can I ask - do you recall roughly when you went through the docs? We revamped theGetting Started guide a fair bit ƒor ESLint's flat config (#8423,#8507) so it'd be good to know if the new docs structure still could use work for first-timers. |
BetaWas this translation helpful?Give feedback.
All reactions
-
I would say it was more than a year ago. The flat config is great and easy to understand, but I think we are missing crucial directions on how to do the rest (plugin, extension, second config file etc.), because the flat config by itself won't suffice to start a project with typescript-eslint. |
BetaWas this translation helpful?Give feedback.
All reactions
-
I may have found the issue with my config. It started working when I deleted the flat file config. Should we only keep one file? It's not clear.
|
BetaWas this translation helpful?Give feedback.
All reactions
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
It sounds to me like you came to our docs expecting an explainer on how to migrate to flat configs and/or a high level guide on how to use flat configs. But that isn't the intention of our quick start guide. Instead the intention is, as stated in the optioning paragraph (Emphasis mine)
We're not looking to be an alternative to eslint's docs - instead we are just trying to fill the very common pain-point of "I have no setup and I want one with as little effort as possible". The reason we link the ESLint docs is because they really are the best resource to explain how to do anything with a config file. We could provide some examples but they would merely be duplicates on top of the ones shown in eslint's own docs. |
BetaWas this translation helpful?Give feedback.
All reactions
👍 1
-
Exactly!
It makes sense now that I understood that the issues were related to eslint rather than typescript-eslint. Even thought I've been using ESLint for years, I'm not very familiar with it and I didn't know about the new config format.
Thanks for the clarifications! |
BetaWas this translation helpful?Give feedback.
All reactions
-
Would it be possible to use a TypeScript configuration file named My The only fix I found was to set |
BetaWas this translation helpful?Give feedback.
All reactions
-
Not at the moment. We just build on top of ESLint, and ESLint manages all configuration file loading. ...but good news: |
BetaWas this translation helpful?Give feedback.
All reactions
-
Note that in the new versions of eslint this is now possible! |
BetaWas this translation helpful?Give feedback.
All reactions
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
My only pain point is endless prereleases. |
BetaWas this translation helpful?Give feedback.
All reactions
-
Uh oh!@RobinTail, the image you shared is missing helpful alt text. Check#6121 (comment). Alt text is an invisible description that helps screen readers describe images to blind or low-vision users. If you are using markdown to display images, add your alt text inside the brackets of the markdown image. Learn more about alt text atBasic writing and formatting syntax: images on GitHub Docs.
|
BetaWas this translation helpful?Give feedback.
All reactions
-
I'm not quite sure how to interpret this feedback. You want more releases? We're looking for constructive feedback in this forum - things we can action and improve. But on the surface this just seems like venting? |
BetaWas this translation helpful?Give feedback.
All reactions
-
@bradzacher ignore it, it's just an ungrateful useless waste of time. Every release is welcomed and appreciated! |
BetaWas this translation helpful?Give feedback.
All reactions
-
You can interpret it this way: all good with version 8, it works well; I'd like the stable version to be released ASAP, preferably three months ago. |
BetaWas this translation helpful?Give feedback.
All reactions
❤️ 1
-
I don't understand why the recommended approach to adding this plugin doesn't seem to match the flat config model. Instead of exporting an object that can be added to an array of configs, it seems the recommended approach is to export a Iow, how does this... exportdefaulttseslint.config(eslint.configs.recommended,tseslint.configs.recommended); ...map to this? exportdefault[// my configs]; How does the args object in exportdefault[{files:["**/*.{js,mjs,cjs,ts,mts,jsx,tsx}"],languageOptions:{parser:"@typescript-eslint/parser",// etc}},// more configs...] Maybe there is an explanation in the docs somewhere, but I couldn't find it 😞 |
BetaWas this translation helpful?Give feedback.
All reactions
-
I would add, flattening logic was also recently added so that you don't have to care whether included configs are arrays or single objects (#10333). In case that was a point of confusion as well |
BetaWas this translation helpful?Give feedback.
All reactions
👍 1
-
One the one hand, it's great that you add this convenience function. I would still argue that:
|
BetaWas this translation helpful?Give feedback.
All reactions
👍 1
-
The typescript-eslint maintenance team has extensively advocated for these types of DX improvements upstream, with varying degrees of success. A few miscellaneous examples
|
BetaWas this translation helpful?Give feedback.
All reactions
👍 1
-
The eslint team decided that flat configs would be an exported array. This is great for pure, untyped JS! But it sucks if you want typechecking (and thus features like intellisense, autocomplete, hover docs, etc) cos you have to annotate the array with a JSDoc comment to get the features. So to make it dead simple to have typechecking we provide an identity function. That way people don't need to fuss with JSDoc and can just write JS code and not think about the types. We made it a variadic function (a function that takes any number of arguments) instead of a function that accepts an array as a single argument because TS can provide better errors with a variadic function. TS tends to type an entire array as its elements - so when you make a mistake TS errors on the entire array instead of at the actual error. But a variadic function TS can granulalry error on the individual config object providing a better DevX. Though its worth noting that as Kirk mentioned - we now do array flattening which means you can write |
BetaWas this translation helpful?Give feedback.
All reactions
👍 1
-
Also as kirk said - we communicate with and suggest improvements to the ESLint core team regularly. Our maintenance team submits enhancements issues, bug reports, RFCs and PRs. Josh G is also a member of the committer team for eslint. We work to influence the core team to provide a better DevX where we can. And where we disagree we will build what we can so that we can lead through example. |
BetaWas this translation helpful?Give feedback.
All reactions
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
It's unclear from the documentation how to use Alternatively, why are you not importing and reusing typings from ESLint? I believe these days they provide typings you can just import. Also, what is the relation between |
BetaWas this translation helpful?Give feedback.
All reactions
-
Have you read the package docs? This should answer many of your questions
Incompatible with any typings actually. It's the problem with inferred types. The solution is to either declare types yourself or use a
Many reasons. ESLint didn't own their types until very, very recently. Before that it was in DefinitelyTyped. When things were in DT - owning our types makes it a lot easier for us to work because we can make changes and fix bugs without waiting for the very very slow DefinitelyTyped merge workflow. Additionally if we relied on the DT types we'd have less control over the types the user gets - they could install any number of versions and we'd have to try and support a large range. But by owning our types we know exactly what types each release uses. We also provide a different AST and there isn't a good, clean way to define the types in a way that would work with multiple ASTs. It was much easier to just fork the types. Additionally we provide our own scope analyser and again it's not possible to integrate this into the types. Forking allows us to do so easily. Forking also gives us the ability to add non-standard properties trivially. For example we've added many properties to make documentation generation easier for rules. We also declare types that are intended to make it easier for people to write configs. Eslint's types are intended to strictly define every single state that can be defined. Ours provides a nicer DevX. I could go on. Many reasons that maintaining our own types is good for us. |
BetaWas this translation helpful?Give feedback.
All reactions
👍 2
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
Either way, with every ESLint related package now doing their own thing, types will remain to be incompatible. I'd rather see you working together with the main ESLint maintainers to get to a point where you both are happy with the typings, rather than competing against them for the best typings. End users (which is us) don't want to have to deal with competing incompatible stuff when we "have to" use them together. With all due respect, your explanation gives off a strong15 standards vibe. |
BetaWas this translation helpful?Give feedback.
All reactions
-
The typescript-eslint parser is incredibly slow in ways that don't make sense. For instance, I have a importStackfrom'~/components/ui/layout/Stack.vue'importButtonfrom'~/components/ui/Button.vue'importLabelfrom'~/components/ui/Label.vue'importCloudImagefrom'~/components/ui/CloudImage.vue'import{typeImage}from'~/models/links-v4'import{typeSuccessEventInfo}from'./helpers'importUploadWidgetfrom'./UploadWidget.vue'withDefaults(defineProps<{title:stringdefaultImageUrl?:stringpreset?:'button'|'product'|'logo'}>(),{preset:'button'})constimage=defineModel<Image>({default:{url:''}})constonSuccess=(info:SuccessEventInfo)=>{image.value={url:info.secure_url,provider:'CLOUDINARY',providerId:info.public_id,version:String(info.version)}} With
Parsing for just that bit of script took 5 seconds. According to the ESLint debugger, it hasn't even gotten to the linting part, which will go on to take an additional six seconds. However, if I apply
Again, according to ESLint, this is just the initial parsing stage. But with type-check rules enabled, TypeScript ESLint apparently takes 133x longer to parse (and 20x longer to lint). ESLint parsing / linting is so bad with this plugin that I'm trying to figure out ways to remove it entirely. But, ideally, these kinds of massive performance hits would not happen. I do realize that "type-aware" linting can and should take longer, but the parsing piece doesn't make sense to me. |
BetaWas this translation helpful?Give feedback.
All reactions
-
We also are accepting PRs to help improve performance if someone wants to help us investigate and improve things. |
BetaWas this translation helpful?Give feedback.
All reactions
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
A few things:
I'm a nerd who reads the docs. I'm aware there is a performance penalty for using types, and I suspected that "parsing" was also creating a TypeScript project. That said, the docs say this:
and they also say...
I can't speak to what happens for most users. But, I wholly agree withthis statementmade by@kirkwaiblinger:
My experience thus far is that any type-aware linting has a cost that's incredibly large, and ultimately not worth it. I've worked for companies with projects of a size that I would call typical, a monorepo with some backend packages and some frontend ones. Using type-aware linting can cause the VSCode ESLint plugin to freeze up entirely. Because it takes so many seconds to lint a page, then enabling "lint on save" can ruin your workflow. If you're very careful, and re-configure the root Aside from the above issue, it just takes a super duper long time even linting the files you want to, or linting the project after a CI error. Being hand-wavy and saying that an error that occurs in CI doesn't matter in terms of time I think is just not true. The time can add up, where people are waiting on builds to finish to deploy, and then once you have an issue, context-switching back locally to find / solve that problem. Which can then significantly alter your flow of how many things you can get done in a day. What's tricky is that the docs also don't mention one key detail: if you disable every type-aware linting RULE, you will NOT disable type-aware linting. I discovered that one thing thedisable type-checked rules config is doing is ALSO disabling the project and projectService properties. A developermay reason this backwards by noting the docs say how to turn type checking ON, but it's not immediately obvious that if a user is using NO type-checking rules, they may still incur a type-checking performance penalty. So, my personal preference would be that this project be more clear that type-checking linting is PROBABLY not necessary, or, at least, more strongly infer that someone should carefully weigh the trade-offs between performance / time costs and the marginal benefits of those few type-aware rules (unless you think there are specific type-aware rules that are incredibly valuable to a developer, which would be good to state outright). |
BetaWas this translation helpful?Give feedback.
All reactions
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
related:#8506 |
BetaWas this translation helpful?Give feedback.
All reactions
-
Responding only to this part for now: this is the ~opposite conclusion of our intent in the docs 😄. We're trying to convey that type-checked linting is VERY USEFUL for MOST projects and you should always at leaststrongly consider it. |
BetaWas this translation helpful?Give feedback.
All reactions
👍 1
-
Anecdotally this is the opposite of what I've heard from many users at companies with large codebases - and I've spoken to users at a half a dozen large tech companies. Those that use it love it, but they do hate the perf cost. Those that don't use it lament that they can't use it because the perf cost is too great for them. The various promise rules are the thing that people most want from my experience as it's the easiest thing to mess up at scale and requires type-aware linting to watch for. As an example - at Canva our codebase is too big to be able to run type-aware linting. We have 90k TS files. Just doing plain, boring, non-type-aware eslint run parallelised across 30 cores takes us 2 minutes in CI. Additionally our architecture means there isn't a good way to slice and dice distinct units for parallelised type-aware linting. But we see massive value in type-aware linting so we sought out other ways to use it. We forkedthis language service plugin so that we could provide type-aware lint errors to engineers without impacting lint times. We don't get CI enforcement but it's often enough to just show the user the errors in their IDE and they will respect the squiggles. TL;DR - I would strongly, strongly, strongly disagree with the sentiment that type-aware linting is not worth it. It has incredible value in catching real big vectors that are otherwise only catchable via deep and thorough human code reviews (which doesn't ever happen - let's be real). The question to answer isn't "should I use type-aware linting?" instead it's "how can I enable type-aware linting?" |
BetaWas this translation helpful?Give feedback.
All reactions
👍 2
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
Please export the recommended rulesets separately from the configs. I find the ecosystem of "helpers" in the World of Flat Configs to be unhelpful at best, and usually counter-productive. The recommended configs (everyones, not just yours) are basically opaque black boxes that stymie attempts to understand why things break when they break, which is going to happen more often now that ESLint is expanding to support other types of files beyond Javascript. I want to write my own config file so that I understand what is happening. I want to write: {name:"TypeScript",files:[...],plugins:['@typescript-eslint: tseslint],languageOptions:{...},rules:{...tseslint.configs.ruleSets.recommendedTypeChecked}// or whatever} But I can't, and I have to write consttseslintRecommendedTypeCheckedRules=Object.assign({}, ...tseslint.configs.recommendedTypeChecked.map(({rules})=>rules).filter(Boolean),);{ ...rules:{ ...tseslintRecommendedTypeCheckedRules},} Which is both annoying and fragile, since it depends on the "internals" of the black box, which can easily change even in a patch version. |
BetaWas this translation helpful?Give feedback.
All reactions
-
I'm confused....We have had support for This new utility function that eslint is introducing and What usecase do you think theirs will cover that ours does not when they are equivalent...? |
BetaWas this translation helpful?Give feedback.
All reactions
Uh oh!
There was an error while loading.Please reload this page.
Uh oh!
There was an error while loading.Please reload this page.
-
Ah, I see that the use of Not for me. I want to declare my own configs so I can understand what they do simply by reading the config. That's it. Yes, the old config format used |
BetaWas this translation helpful?Give feedback.
All reactions
-
If you'll allow me, you might look at this discussion as representative of the difference between top-down and bottom-up learners. I'm a bottom-up-style learner. I find suggestions like "just use Other people are top-down and are comfortable typing |
BetaWas this translation helpful?Give feedback.
All reactions
-
It wasn't actually a single config - And note thatthe configs haven't changed at all. The configs we supply for flat configs areexactly the same as the configs for legacy configs. |
BetaWas this translation helpful?Give feedback.
All reactions
-
From reading your comments - you didn't actually don't have an issue understanding the configs - cos you're able to successfully configure both legacy and flat configs. The problem is instead that as soon as you add a new language (in your case JSON) everything gets much more complicated and we move into a new realm of config setup whereeverything changes. Essentially you've hit a rough edge of eslint itself right now. The new "languages" aren't compatible with rules intended for JS/TS. So now instead of just configuring every rule to always run you have to very specifically constrain all the JS/TS stuff to just the right files. It's a big shift in config style and complexity. The current tooling doesn't do a great job of showing you what's not working or why. The config inspector can show you but you need to understand how to drive it and you need to understand what it's telling you. For example your question has been "why is eslint crashing?" and the inspector does technically answer that question - but only if you have a deeper understanding of eslint. The answer is "it's crashing because you're running JS/TS rules on JSON files" and the config inspector shows you that answer by showing you that you have JS/TS rules running on JSON files. But if you don't understand that concept (that certain rules aren't compatible with certain languages) then that answer will be unobtainable. The rough edge in eslint here is that realistically the JS/TS rules that don't work on JSON shouldn't run on JSONautomatically. It shouldn't be something you need to think about. But sadly eslint isn't there yet with this new languages concept. Would be worth talking to eslint core about your pain here - I'm sure it's going to be a common pain point and is something they should fix. |
BetaWas this translation helpful?Give feedback.
All reactions
👍 1
-
My pain point right now is similar to#10538. I receive
Considering |
BetaWas this translation helpful?Give feedback.
All reactions
-
Uh oh!@gtbuchanan, at least one image you shared is missing helpful alt text. Check#6121 (comment) to fix the following violations:
Alt text is an invisible description that helps screen readers describe images to blind or low-vision users. If you are using markdown to display images, add your alt text inside the brackets of the markdown image. Learn more about alt text atBasic writing and formatting syntax: images on GitHub Docs.
|
BetaWas this translation helpful?Give feedback.
All reactions
-
Not that I want to "pass the buck" on this but we do not support Vue's language tooling. We support anything that works when you run Vue has its own, bespoke language tooling which wraps typescript and so we do not support it. Instead the Vue team supports it and provides their own wrappers that integrate their language tooling with our tooling. |
BetaWas this translation helpful?Give feedback.
All reactions
-
this is defiened useful of individual developers |
BetaWas this translation helpful?Give feedback.
All reactions
👍 1