Nuxt/docs/2.guide/1.concepts/9.code-style.md

---
title: 'Code Style'
description: "Nuxt supports ESLint out of the box"
---

## ESLint

The recommended approach for Nuxt is to enable ESLint support using [`@nuxt/eslint-config`](https://github.com/nuxt/eslint-config).

At the moment, this configuration will not format your files; you can set up Prettier or another tool to do so.

::alert{type=info}
We're currently working to refactor the Nuxt ESLint configuration. Subscribe to the [Nuxt ESLint roadmap](https://github.com/nuxt/eslint-config/issues/303) to follow updates.
::

### Install Dependencies

Install both ESLint and the Nuxt configuration as development dependencies.

::code-group

```bash [yarn]
yarn add --dev eslint @nuxt/eslint-config
```

```bash [npm]
npm install --save-dev eslint @nuxt/eslint-config
```

```bash [pnpm]
pnpm add -D eslint @nuxt/eslint-config
```

```bash [bun]
bun add -D eslint @nuxt/eslint-config
```

::

### Configuration

Add `.eslintrc.cjs` to the root folder of your Nuxt app.

```js
module.exports = {
  root: true,
  extends: ['@nuxt/eslint-config'],
}
```

### Modify package.json

Add the below to lint commands to your `package.json` script section:

```json
  "scripts": {
    ...
    "lint": "eslint .",
    "lint:fix": "eslint . --fix",
    ...
  },
```

Run the `lint` command to check if the code style is correct or run `lint:fix` to automatically fix issues.

### Configuring VS Code

Install the [VS Code ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint).

In VS Code press `ctrl+shift+p` (`cmd+shift+p` on Mac) to open the command prompt, find `Open Workspace Settings (JSON)`, add the below lines to the JSON and save:

```json
{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit"
  }
}
```

You're good to go! On save, your files will be linted and auto-fixed.