TTC
Theo's Typesafe Cult•16mo ago
lucca

Why am I getting these TypeScript ESLint errors even though VSCode doesn't complain?

Here is my repo. It was bootstrapped with create-t3-app: https://github.com/ChromeUniverse/luccanotes And here is the full output of npm run lint: 
> luccanotes@0.1.0 lint
> next lint

info  - Loaded env from /home/lucca/Coding/Projects/luccanotes/.env

./src/components/Button.tsx
1:1  Warning: Import "VariantProps" is only used as types.  @typescript-eslint/consistent-type-imports
6:3  Warning: 'IconProps' is defined but never used.  @typescript-eslint/no-unused-vars
11:1  Warning: Imports "TooltipAlignment" and "TooltipPosition" are only used as types.  @typescript-eslint/consistent-type-imports

./src/components/Navbar.tsx
24:3  Warning: 'noteTitle' is defined but never used.  @typescript-eslint/no-unused-vars

./src/components/NoteCard.tsx
1:10  Warning: 'ArrowSquareOut' is defined but never used.  @typescript-eslint/no-unused-vars
1:26  Warning: 'DotsThreeOutlineVertical' is defined but never used.  @typescript-eslint/no-unused-vars
16:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
29:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
36:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
37:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
48:3  Warning: 'lastUpdated' is defined but never used.  @typescript-eslint/no-unused-vars

./src/components/SearchBar.tsx
10:10  Warning: 'useState' is defined but never used.  @typescript-eslint/no-unused-vars
11:1  Warning: All imports in the declaration are only used as types. Use `import type`.  @typescript-eslint/consistent-type-imports
12:8  Warning: 'Button' is defined but never used.  @typescript-eslint/no-unused-vars
130:57  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment

./src/components/TagPill.tsx
1:1  Warning: Import "VariantProps" is only used as types.  @typescript-eslint/consistent-type-imports

./src/components/Tooltip.tsx
1:1  Warning: Import "VariantProps" is only used as types.  @typescript-eslint/consistent-type-imports

./src/pages/index.tsx
1:8  Warning: 'Head' is defined but never used.  @typescript-eslint/no-unused-vars
2:8  Warning: 'Link' is defined but never used.  @typescript-eslint/no-unused-vars
3:10  Warning: 'signIn' is defined but never used.  @typescript-eslint/no-unused-vars
3:18  Warning: 'signOut' is defined but never used.  @typescript-eslint/no-unused-vars
3:27  Warning: 'useSession' is defined but never used.  @typescript-eslint/no-unused-vars
4:10  Warning: 'api' is defined but never used.  @typescript-eslint/no-unused-vars
8:1  Warning: Import "SortField" is only used as types.  @typescript-eslint/consistent-type-imports
11:1  Warning: All imports in the declaration are only used as types. Use `import type`.  @typescript-eslint/consistent-type-imports

info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
> luccanotes@0.1.0 lint
> next lint

info  - Loaded env from /home/lucca/Coding/Projects/luccanotes/.env

./src/components/Button.tsx
1:1  Warning: Import "VariantProps" is only used as types.  @typescript-eslint/consistent-type-imports
6:3  Warning: 'IconProps' is defined but never used.  @typescript-eslint/no-unused-vars
11:1  Warning: Imports "TooltipAlignment" and "TooltipPosition" are only used as types.  @typescript-eslint/consistent-type-imports

./src/components/Navbar.tsx
24:3  Warning: 'noteTitle' is defined but never used.  @typescript-eslint/no-unused-vars

./src/components/NoteCard.tsx
1:10  Warning: 'ArrowSquareOut' is defined but never used.  @typescript-eslint/no-unused-vars
1:26  Warning: 'DotsThreeOutlineVertical' is defined but never used.  @typescript-eslint/no-unused-vars
16:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
29:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
36:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
37:59  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment
48:3  Warning: 'lastUpdated' is defined but never used.  @typescript-eslint/no-unused-vars

./src/components/SearchBar.tsx
10:10  Warning: 'useState' is defined but never used.  @typescript-eslint/no-unused-vars
11:1  Warning: All imports in the declaration are only used as types. Use `import type`.  @typescript-eslint/consistent-type-imports
12:8  Warning: 'Button' is defined but never used.  @typescript-eslint/no-unused-vars
130:57  Error: Unsafe assignment of an `any` value.  @typescript-eslint/no-unsafe-assignment

./src/components/TagPill.tsx
1:1  Warning: Import "VariantProps" is only used as types.  @typescript-eslint/consistent-type-imports

./src/components/Tooltip.tsx
1:1  Warning: Import "VariantProps" is only used as types.  @typescript-eslint/consistent-type-imports

./src/pages/index.tsx
1:8  Warning: 'Head' is defined but never used.  @typescript-eslint/no-unused-vars
2:8  Warning: 'Link' is defined but never used.  @typescript-eslint/no-unused-vars
3:10  Warning: 'signIn' is defined but never used.  @typescript-eslint/no-unused-vars
3:18  Warning: 'signOut' is defined but never used.  @typescript-eslint/no-unused-vars
3:27  Warning: 'useSession' is defined but never used.  @typescript-eslint/no-unused-vars
4:10  Warning: 'api' is defined but never used.  @typescript-eslint/no-unused-vars
8:1  Warning: Import "SortField" is only used as types.  @typescript-eslint/consistent-type-imports
11:1  Warning: All imports in the declaration are only used as types. Use `import type`.  @typescript-eslint/consistent-type-imports

info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
Why am I getting these errors? VSCode and the Next.js dev server don't seem to be complaining.
GitHub
GitHub - ChromeUniverse/luccanotes: A full-stack note-taking app fo...
A full-stack note-taking app for Markdown lovers ❤️ - GitHub - ChromeUniverse/luccanotes: A full-stack note-taking app for Markdown lovers ❤️
3 Replies
Unknown User
Unknown User•16mo ago
Message Not Public
Sign In & Join Server To View
michaelschufi
michaelschufi•16mo ago
So, two things: - VS Code probably doesn't complain because you don't have the ESLint extension enabled (See @Cloud 's message), or the extension cannot find the ESLint config file. Make sure to open the repo's root folder in VS Code. - If you look at the rules inside the ESLint config .eslintrc.json (https://github.com/ChromeUniverse/luccanotes/blob/main/.eslintrc.json) you can check which rulesets/plugins are enabled for your project. As you can see @typescript-eslint's recommended-requiring-type-checking is enabled for Typescript files, as well as next/core-web-vitals and @typescript-eslint/recommended . On line 20 you can also see a rule override "@typescript-eslint/consistent-type-imports": "warn" which warns you if you don't add the type keyword to your imports (See @PedeEli 's message). Generally, whenever you have questions about an ESLint rule/error, I recommend googling its definition (https://typescript-eslint.io/rules/consistent-type-imports/). Most rules are well explained, and you can then decide if you want to disable some of them or not. Also, many rules are automatically fixable. You can run the fixing either through the linting CLIs or through your IDE's ESLint extensions.
GitHub
luccanotes/.eslintrc.json at main · ChromeUniverse/luccanotes
A full-stack note-taking app for Markdown lovers ❤️ - luccanotes/.eslintrc.json at main · ChromeUniverse/luccanotes
lucca
lucca•16mo ago
This was it - never heard of either plugin but they immediately picked up on the .eslintrc.json and prettier.config.cjs and showed me all errors and warnings in VSCode. Also had to rearrange some exported types and change the import statement per @PedeEli's suggestion Thanks for the detailed explanation! I'll check out the ESLint docs
Want results from more Discord servers?
Add your server
More Posts
Why useQuery runs multiple times?my first time of using react query and facing issue of running API request multiple times, I dont knIs these animations a lot for a library like react?I want to make an algorithm visualizer, like this one: https://www.toptal.com/developers/sorting-algTRPC + RedisHey Guys, I'm exploring using redis to make my data real time and using trpc as a rest like API. IProblems with useQuery.onSuccess()Hi there, I'm doing a query on my trpc router and when it succeds I want to put that data on a useStdo you have experience with the python prisma client?hay gang, has anyone used the python client for prisma? what's your take? https://github.com/RobertConditionally required typesSomeone that has any ideas on how I can make everything required if accepted is true, if it's false Static typing key: value of an object while definingIdeally, want to statically type the keys and values in THEMES object in compile time. Currently, keRequire one of two propertiesWhat would you folks say is a clean way to accomplish that either userToken or ConversationId are sZod array of datesCan someone help me validate that a variable is an array of exactly two dates and ideally in the futPosting PDF to S3Hello, I Hope this is the right section for Question, it feels like it is. I am working on an Pro