shingangan / eslint-config-nuxt

ESlint config used for Nuxt

Nuxt ESLint packages

Nuxt 3: @nuxt/eslint-config

Non-opinionated ESlint configuration for Nuxt 3 apps.

Features

• Works out-of-the-box with no additional configuration.
• Nuxt-specific rules for pages, components and more.
• ... under active development

Installation

1. Install this package and eslint in your devDependencies.

npm i -D @nuxt/eslint-config eslint
yarn add -D @nuxt/eslint-config eslint
pnpm add -D @nuxt/eslint-config eslint

2. Extend the default Nuxt config by creating an .eslintrc.cjs:

module.exports = {
  root: true,
  extends: ["@nuxt/eslint-config"],
};

You might also want to add a script entry to your `package.json:

{
  "scripts": {
    "lint": "eslint ."
  }
}

Nuxt 2: @nuxtjs/eslint-config and @nuxtjs/eslint-config-typescript

Opinionated ESlint configuration used internally by Nuxt projects.

Usage

Do you want to add the config to your own projects? There you go:

1. Add this package to your devDependencies

$ npm i -D @nuxtjs/eslint-config
# or
$ yarn add -D @nuxtjs/eslint-config

2. Install eslint if not already present locally or globally

$ npm i -D eslint
# or
$ yarn add -D eslint

3. Create a .eslintrc file

4. Extend our config (you can use just the scope name as ESLint will assume the eslint-config prefix):

{
  "extends": ["@nuxtjs/eslint-config"]
}

Full example

A full example .eslintrc for a project with babel support:

Dont forget to npm i -D @babel/eslint-parser or yarn add -D @babel/eslint-parser

{
  "root": true,
  "parser": "@babel/eslint-parser",
  "parserOptions": {
    "sourceType": "module"
  },
  "extends": ["@nuxt/eslint-config"],
}

TypeScript

If you're using TypeScript, follow Usage section by replacing @nuxtjs/eslint-config by @nuxtjs/eslint-config-typescript.

And in your .eslintrc all you need is :

{
  "extends": ["@nuxtjs/eslint-config-typescript"]
}

You can then edit/override same rules as you could with @nuxtjs/eslint-config but also TypeScript rules. You can find the list of supported TypeScript rules here and you can read more about Nuxt's TypeScript support in the docs.

License

Made with ❤️

Published under MIT License.