@nuxtjs/eslint-module

What is @nuxtjs/eslint-module?

@nuxtjs/eslint-module is a Nuxt.js module that integrates ESLint into your Nuxt.js project. It allows you to lint your code on save, during development, and as part of your build process, ensuring that your code adheres to specified coding standards and best practices.

What are @nuxtjs/eslint-module's main functionalities?

Linting on Save

This feature allows you to automatically lint and fix your code every time you save a file. The 'fix' option is set to true to automatically fix linting errors when possible.

module.exports = {
  buildModules: [
    '@nuxtjs/eslint-module'
  ],
  eslint: {
    fix: true
  }
}

Custom ESLint Configuration

This feature allows you to customize the ESLint configuration. You can specify the path to the ESLint binary, the file extensions to lint, and whether to emit warnings and errors.

module.exports = {
  buildModules: [
    '@nuxtjs/eslint-module'
  ],
  eslint: {
    eslintPath: 'eslint',
    extensions: ['js', 'vue'],
    emitWarning: true,
    emitError: true
  }
}

Linting During Build

This feature enables linting during the build process. Setting 'lintOnBuild' to true ensures that your code is linted as part of the build, helping to catch and fix issues before deployment.

module.exports = {
  buildModules: [
    '@nuxtjs/eslint-module'
  ],
  eslint: {
    lintOnBuild: true
  }
}

Other packages similar to @nuxtjs/eslint-module

eslint-loader

eslint-loader is a webpack loader that integrates ESLint into the webpack build process. It allows you to lint your code as part of the build, similar to @nuxtjs/eslint-module, but it requires more manual configuration and is not specifically tailored for Nuxt.js.

eslint-plugin-vue

eslint-plugin-vue is an ESLint plugin for linting Vue.js projects. It provides a set of rules specific to Vue.js, helping to enforce best practices and coding standards. While it can be used in conjunction with @nuxtjs/eslint-module, it does not provide the same level of integration with Nuxt.js.

README

@nuxtjs/eslint-module

ESLint module for Nuxt

📖 Release Notes

---

Note: This branch is for Nuxt 3 or Nuxt Bridge compatible module. Checkout the nuxt2 branch for Nuxt 2 support.

---

Requirements

You need to ensure that you have eslint >= 7 installed:

With pnpm

pnpm add -D eslint

Or, with yarn

yarn add -D eslint

Or, with npm

npm install -D eslint

Setup

1. Add @nuxtjs/eslint-module dependency to your project

With pnpm

pnpm add -D @nuxtjs/eslint-module

Or, with yarn

yarn add -D @nuxtjs/eslint-module

Or, with npm

npm install -D @nuxtjs/eslint-module

1. Add @nuxtjs/eslint-module to the modules section of nuxt.config.ts

export default defineNuxtConfig({
  modules: [
    // Simple usage
    '@nuxtjs/eslint-module',

    // With options
    ['@nuxtjs/eslint-module', { /* module options */ }]
  ]
})

Using top level options

export default defineNuxtConfig({
  modules: [
    '@nuxtjs/eslint-module'
  ],
  eslint: {
    /* module options */
  }
})

Options

You can pass eslint options.

Note that the config option you provide will be passed to the ESLint class. This is a different set of options than what you'd specify in package.json or .eslintrc. See the eslint docs for more details.

cache

• Type: Boolean
• Default: true

Note: The cache is enabled by default to decrease execution time.

include

• Type: String|Array[String]
• Default: [nuxt.options.srcDir.'/**/*.{js,jsx,ts,tsx,vue}']

Specify directories, files, or globs.

exclude

• Type: Array[String]
• Default: ['**/node_modules/**', nuxt.options.buildDir]

Specify the files and/or directories to exclude.

eslintPath

• Type: String
• Default: eslint

Path to eslint instance that will be used for linting.

formatter

• Type: String|Function
• Default: 'stylish'

Accepts a function that will have one argument: an array of eslint messages (object). The function must return the output as a string. You can use official eslint formatters.

lintOnStart

• Type: Boolean
• Default: true

Check all matching files on project startup, too slow, turn on discreetly.

emitWarning

• Type: Boolean
• Default: true

The warnings found will be printed.

emitError

• Type: Boolean
• Default: true

The errors found will be printed.

failOnWarning

• Type: Boolean
• Default: false

Will cause the module build to fail if there are any warnings, based on emitWarning.

failOnError

• Type: Boolean
• Default: false

Will cause the module build to fail if there are any errors, based on emitError.

Contributing

You can contribute to this module online with CodeSandBox:

Or locally:

1. Clone this repository
2. Install dependencies using pnpm install
3. Prepare development server using pnpm dev:prepare
4. Build module using pnpm build
5. Launch playground using pnpm dev

License

MIT License

Copyright (c) Nuxt Community