What is vite-plugin-eslint?
vite-plugin-eslint is a Vite plugin that integrates ESLint into the Vite build process. It allows you to lint your code on build and serve, ensuring that your code adheres to the specified linting rules.
What are vite-plugin-eslint's main functionalities?
Lint on Build
This feature allows you to lint your code during the build process. By adding the eslintPlugin to the Vite configuration, ESLint will run and report any linting errors or warnings.
import { defineConfig } from 'vite';
import eslintPlugin from 'vite-plugin-eslint';
export default defineConfig({
plugins: [eslintPlugin()]
});
Lint on Serve
This feature allows you to lint your code during the development server process. You can specify which files to include or exclude from linting.
import { defineConfig } from 'vite';
import eslintPlugin from 'vite-plugin-eslint';
export default defineConfig({
plugins: [eslintPlugin({
include: ['src/**/*.js', 'src/**/*.vue'],
exclude: ['node_modules']
})]
});
Custom ESLint Options
This feature allows you to pass custom ESLint options to the plugin. For example, you can enable the 'fix' option to automatically fix linting errors where possible.
import { defineConfig } from 'vite';
import eslintPlugin from 'vite-plugin-eslint';
export default defineConfig({
plugins: [eslintPlugin({
eslintOptions: {
fix: true
}
})]
});
Other packages similar to vite-plugin-eslint
eslint-webpack-plugin
eslint-webpack-plugin is a plugin for Webpack that integrates ESLint into the Webpack build process. It offers similar functionality to vite-plugin-eslint but is designed for use with Webpack instead of Vite.
rollup-plugin-eslint
rollup-plugin-eslint is a plugin for Rollup that integrates ESLint into the Rollup build process. Like vite-plugin-eslint, it allows you to lint your code during the build process, but it is tailored for Rollup.
eslint-loader
eslint-loader is a loader for Webpack that allows you to lint your code using ESLint. It is similar to eslint-webpack-plugin but is used as a loader rather than a plugin.
vite-plugin-eslint
ESLint plugin for vite.
Install
npm install eslint vite-plugin-eslint --save-dev
yarn add eslint vite-plugin-eslint -D
Usage
import { defineConfig } from 'vite'
import eslint from 'vite-plugin-eslint'
export default defineConfig({
plugins: [eslint()]
})
Options
You can pass eslint options.
cache
- Type:
boolean
- Default:
false
Decrease execution time, Beta
Cache now correctly recognizes file changes, you can try it out.
fix
- Type:
boolean
- Default:
false
Auto fix source code.
eslintPath
- Type:
string
- Default:
eslint
Path to eslint
instance that will be used for linting.
lintOnStart
- Type:
boolean
- Default:
false
Check all matching files on project startup, too slow, turn on discreetly.
include
- Type:
string | string[]
- Default:
['**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx', '**/*.vue', '**/*.svelte']
A single file, or array of files, to include when linting.
exclude
- Type:
string | string[]
- Default:
['**/node_modules/**']
A single file, or array of files, to exclude when linting.
formatter
- Type:
string | ESLint.Formatter['format']
- Default:
stylish
Custom error formatter or the name of a built-in formatter.
emitWarning
- Type:
boolean
- Default:
true
The warings 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:
true
Will cause the module build to fail if there are any errors, based on emitError
.
License
MIT