@vue/cli-plugin-eslint
Advanced tools
Package description
@vue/cli-plugin-eslint is a Vue CLI plugin that adds ESLint support to your Vue.js projects. It helps in maintaining code quality and consistency by integrating ESLint, a popular linting tool for JavaScript, into the Vue development workflow.
Linting on Save
This feature enables linting of your code every time you save a file. It helps catch errors and enforce coding standards in real-time.
module.exports = {
lintOnSave: true
};Custom ESLint Configuration
This feature allows you to customize the ESLint configuration to fit your project's specific needs. You can add custom rules, plugins, and settings.
module.exports = {
lintOnSave: true,
configureWebpack: {
module: {
rules: [
{
enforce: 'pre',
test: /\.js$/,
loader: 'eslint-loader',
exclude: /node_modules/
}
]
}
}
};Linting Scripts
This feature adds a linting script to your package.json file, enabling you to run ESLint checks via the command line. This is useful for integrating linting into your CI/CD pipeline.
{
"scripts": {
"lint": "vue-cli-service lint"
}
}ESLint is a widely-used linting tool for JavaScript. It can be used independently of Vue CLI and offers extensive customization options. While @vue/cli-plugin-eslint integrates ESLint into Vue projects seamlessly, ESLint itself can be used in any JavaScript project.
eslint-plugin-vue is a plugin for ESLint that provides linting rules specific to Vue.js. It can be used alongside ESLint to enforce Vue-specific coding standards. While @vue/cli-plugin-eslint includes this plugin by default, eslint-plugin-vue can be added to any ESLint configuration.
vue-eslint-parser is a parser for ESLint that allows it to lint Vue.js template files. It works with eslint-plugin-vue to provide comprehensive linting for Vue components. This parser is included in @vue/cli-plugin-eslint but can also be used independently.
Changelog
5.0.4 (2022-03-22)
@vue/cli-service
publicPath: 'auto' (@AndreiSoroka)@vue/cli-shared-utils, @vue/cli-ui
node-ipc with @achrinza/node-ipc to further secure the dependency chainReadme
eslint plugin for vue-cli
vue-cli-service lint
Usage: vue-cli-service lint [options] [...files]
Options:
--format [formatter] specify formatter (default: stylish)
--no-fix do not fix errors
--max-errors specify number of errors to make build failed (default: 0)
--max-warnings specify number of warnings to make build failed (default: Infinity)
--output-file specify file to write report to
Lints and fixes files. If no specific files are given, it lints all files in src and tests, as well as all JavaScript files in the root directory (these are most often config files such as babel.config.js or .eslintrc.js).
Other ESLint CLI options are not supported.
::: tip
vue-cli-service lint will lint dotfiles .*.js by default. If you want to follow ESLint's default behavior instead, consider adding a .eslintignore file in your project.
:::
ESLint can be configured via .eslintrc or the eslintConfig field in package.json. See the ESLint configuration docs for more detail.
::: tip
The following option is under the section of vue.config.js. It is respected only when @vue/cli-plugin-eslint is installed.
:::
Lint-on-save during development with eslint-loader is enabled by default. It can be disabled with the lintOnSave option in vue.config.js:
module.exports = {
lintOnSave: false
}
When set to true, eslint-loader will emit lint errors as warnings. By default, warnings are only logged to the terminal and does not fail the compilation.
To make lint errors show up in the browser overlay, you can use lintOnSave: 'error'. This will force eslint-loader to always emit errors. this also means lint errors will now cause the compilation to fail.
Alternatively, you can configure the overlay to display both warnings and errors:
// vue.config.js
module.exports = {
devServer: {
overlay: {
warnings: true,
errors: true
}
}
}
When lintOnSave is a truthy value, eslint-loader will be applied in both development and production. If you want to disable eslint-loader during production build, you can use the following config:
// vue.config.js
module.exports = {
lintOnSave: process.env.NODE_ENV !== 'production'
}
vue add eslint
config.module.rule('eslint')config.module.rule('eslint').use('eslint-loader')FAQs
eslint plugin for vue-cli
The npm package @vue/cli-plugin-eslint receives a total of 447,116 weekly downloads. As such, @vue/cli-plugin-eslint popularity was classified as popular.
We found that @vue/cli-plugin-eslint demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Git dependencies in open source packages can introduce significant risks, including lack of version control, stability issues, dependency drift, and difficulty in auditing, making them potential targets for supply chain attacks.
Security News
Node.js has added experimental support for TypeScript, a move that highlights the growing importance of TypeScript in modern development.
Product
Check out what's new at Socket with our Product Changelog. It tracks all public-facing updates, improvements, and fixes so you can take full advantage of our features.