---
title: "Discussion on \"Setting up ESLint & Prettier in ViteJS\" | Hashnode"
description: "Discussion on \"Setting up ESLint & Prettier in ViteJS\". Learn how to set up ESLint & Prettier in your ViteJS project."
url: "https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [Setting up ESLint & Prettier in ViteJS](https://cathalmacdonnacha.com/setting-up-eslint-prettier-in-vitejs?utm_source=hashnode&utm_medium=feed)

Learn how to set up ESLint & Prettier in your ViteJS project.

Aug 11, 2022 · 4 min read · cathalmacdonnacha.com  
Updated Nov 27, 2024  
Read the article

-   [#vite](https://hashnode.com/tag/vite)
-   [#web-development](https://hashnode.com/tag/web-development)
-   [#reactjs](https://hashnode.com/tag/reactjs)
-   [#javascript](https://hashnode.com/tag/javascript)

## Written by

[Cathal Mac Donnacha](https://hashnode.com/@cathalmacdonnacha)

@cathalmacdonnacha · Ireland 🇮🇪

  
[View profile](https://hashnode.com/@cathalmacdonnacha)

Follow me on my journey as I write about tech topics I face in my everyday life as a Frontend Developer 💻

## Responses 5

Markdown supported · ⌘↵ to post

[The14Some1](https://hashnode.com/@Some1)

[Jul 25, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/64bff2820f333e2584915a16)

You haven't specified the name for prettier ignore file. Other than that, great guide.

[Cathal Mac Donnacha](https://hashnode.com/@cathalmacdonnacha)

[Jul 25, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/64bff2820f333e2584915a16#reply-64bff406dfa67f260ae440a6)

Fixed, thanks!

[Mohamed Hossam Eddine](https://hashnode.com/@mhossameddine)

[Jul 1, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/64a02c9a8db091c40103358d)

I wonder about the reason for not installing eslint and prettier dependencies as dev dependencies

[Cathal Mac Donnacha](https://hashnode.com/@cathalmacdonnacha)

[Jul 25, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/64a02c9a8db091c40103358d#reply-64bff473dfa67f260ae440b2)

[Here ya go.](https://github.com/vitejs/vite/discussions/1803#discussioncomment-322107)

[Jacopo Marrone](https://hashnode.com/@tresorama)

[Jun 22, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/6493af80f012983651c30c15)

Great articles! For my taste also these are good to have:

```
//  in .eslintrc.js
"extends": [
  ...
  //  already there
  "plugin:react/recommended",
  // warn when rules of hooks are violated
  "plugin:react-hooks/recommended",
  // disable requirements to import react at the top of the file
  // requires to "npm i -D eslint-plugin-react-hooks"
  "plugin:react/jsx-runtime",
]
...
```

[Kenan Berker](https://hashnode.com/@kbbuk)

[Jun 5, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/647db269eddaed146e65837e)

Thank you for your guides on migrating to Vite. One error I came across was some missing config for using `eslint-plugin-import`. I needed to set it up with Typescript using `eslint-import-resolver-typescript`.

[Malin Hanák](https://hashnode.com/@Mallan)

[Feb 22, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/63f5b9c4f338bec1cf2df4f4)

I wonder if you ever ran into some issues with eslint being unable to resolve absolute paths when running linting. I am but I am, I have both baseURL in tsconfig and using vite-tsconfig-paths for vite config but eslint seems to need something else.

[Malin Hanák](https://hashnode.com/@Mallan)

[Feb 22, 2023](https://hashnode.com/posts/setting-up-eslint-prettier-in-vitejs/62f4d0e72e865683123df26d/comment/63f5b9c4f338bec1cf2df4f4#reply-63f5c7b8f338bec1cf2df74f)

would just like to add that I solved this by adding following to the eslintrc:

```
"import/resolver": {
      ...
      "typescript": {}
    }
```