Grunt-eslint 并启用 `--fix` 标志以自动修复违规行为
Grunt-eslint & enabling `--fix` flag to auto fix violations
我知道 eslint
CLI 本身有一个 --fix
标志,但我无法从文档中得知如何通过 eslintConfig
(在 package.json
中)使用它或者在我的 Gruntfile 中的 grunt-eslint 配置中。
我在 package.json
中有以下配置:
"env": {
"browser": true,
"amd": true
},
"extends": "eslint:recommended",
并使用此 Grunt 配置通过 lint
任务调用它:
eslint: {
target: [
'src/app/**/*.js'
],
format: 'checkstyle'
},
如何在这种情况下启用 --fix
标志?
对于 --fix
标志,您只需将 options: { fix: true }
添加到您的 gruntfile。
这是我的 gruntfile eslint 任务的示例(grunt-eslint 18.1.0
和 eslint 2.12.0
):
eslint: {
options: {
configFile: '.eslintrc.json',
format: 'html',
outputFile: 'report.html',
fix: true
},
target: [
'routes/**',
'server.js',
'gruntfile.js'
]
}
添加到答案中,如果您不想总是修复,您可以将标志传递给 g运行t,例如
grunt eslint --fix
并且在 eslint
的 g运行t 配置中
eslint: {
options: {
fix: grunt.option('fix') // this will get params from the flags
}
}
所以 运行 grunt eslint
不会解决任何问题。您必须 运行 grunt eslint --fix
才能让 eslint 修复错误。
阅读更多关于 grunt.option
如果没有
extend(config, ctx) {
// Run ESLint on save
if (ctx.isDev && ctx.isClient) {
config.module.rules.push({
enforce: 'pre',
test: /\.(js|vue)$/,
loader: 'eslint-loader',
exclude: /(node_modules)/,
options: {
fix: true
}
})
}
}
You. You can use this on the first page
const colors = require('vuetify/es5/util/colors').default
const pkg = require('./package')
require('dotenv').config()
module.exports = {
mode: 'universal',
/*
** Headers of the page
*/
head: {
titleTemplate: '%s - ' + process.env.npm_package_name,
title: process.env.npm_package_name || '',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{
hid: 'description',
name: 'description',
content: process.env.npm_package_description || ''
}
],
link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]
},
/*
** Customize the progress-bar color
*/
loading: { color: '#fff' },
/*
** Global CSS
*/
css: [],
/*
** Plugins to load before mounting the App
*/
plugins: [],
/*
** Nuxt.js dev-modules
*/
buildModules: [
// Doc: https://github.com/nuxt-community/eslint-module
'@nuxtjs/eslint-module',
'@nuxtjs/vuetify'
],
/*
** Nuxt.js modules
*/
modules: [
// Doc: https://axios.nuxtjs.org/usage
'@nuxtjs/axios',
'@nuxtjs/pwa',
// Doc: https://github.com/nuxt-community/dotenv-module
'@nuxtjs/dotenv'
],
/*
** Axios module configuration
** See https://axios.nuxtjs.org/options
*/
axios: {},
/*
** vuetify module configuration
** https://github.com/nuxt-community/vuetify-module
*/
/*
** Build configuration
*/
build: {
extend(config, ctx) {
// Run ESLint on save
if (ctx.isDev && ctx.isClient) {
config.module.rules.push({
enforce: 'pre',
test: /\.(js|vue)$/,
loader: 'eslint-loader',
exclude: /(node_modules)/,
options: {
fix: true
}
})
}
}
}
}
我知道 eslint
CLI 本身有一个 --fix
标志,但我无法从文档中得知如何通过 eslintConfig
(在 package.json
中)使用它或者在我的 Gruntfile 中的 grunt-eslint 配置中。
我在 package.json
中有以下配置:
"env": {
"browser": true,
"amd": true
},
"extends": "eslint:recommended",
并使用此 Grunt 配置通过 lint
任务调用它:
eslint: {
target: [
'src/app/**/*.js'
],
format: 'checkstyle'
},
如何在这种情况下启用 --fix
标志?
对于 --fix
标志,您只需将 options: { fix: true }
添加到您的 gruntfile。
这是我的 gruntfile eslint 任务的示例(grunt-eslint 18.1.0
和 eslint 2.12.0
):
eslint: {
options: {
configFile: '.eslintrc.json',
format: 'html',
outputFile: 'report.html',
fix: true
},
target: [
'routes/**',
'server.js',
'gruntfile.js'
]
}
添加到答案中,如果您不想总是修复,您可以将标志传递给 g运行t,例如
grunt eslint --fix
并且在 eslint
的 g运行t 配置中eslint: {
options: {
fix: grunt.option('fix') // this will get params from the flags
}
}
所以 运行 grunt eslint
不会解决任何问题。您必须 运行 grunt eslint --fix
才能让 eslint 修复错误。
阅读更多关于 grunt.option
如果没有
extend(config, ctx) {
// Run ESLint on save
if (ctx.isDev && ctx.isClient) {
config.module.rules.push({
enforce: 'pre',
test: /\.(js|vue)$/,
loader: 'eslint-loader',
exclude: /(node_modules)/,
options: {
fix: true
}
})
}
}
You. You can use this on the first page
const colors = require('vuetify/es5/util/colors').default
const pkg = require('./package')
require('dotenv').config()
module.exports = {
mode: 'universal',
/*
** Headers of the page
*/
head: {
titleTemplate: '%s - ' + process.env.npm_package_name,
title: process.env.npm_package_name || '',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{
hid: 'description',
name: 'description',
content: process.env.npm_package_description || ''
}
],
link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]
},
/*
** Customize the progress-bar color
*/
loading: { color: '#fff' },
/*
** Global CSS
*/
css: [],
/*
** Plugins to load before mounting the App
*/
plugins: [],
/*
** Nuxt.js dev-modules
*/
buildModules: [
// Doc: https://github.com/nuxt-community/eslint-module
'@nuxtjs/eslint-module',
'@nuxtjs/vuetify'
],
/*
** Nuxt.js modules
*/
modules: [
// Doc: https://axios.nuxtjs.org/usage
'@nuxtjs/axios',
'@nuxtjs/pwa',
// Doc: https://github.com/nuxt-community/dotenv-module
'@nuxtjs/dotenv'
],
/*
** Axios module configuration
** See https://axios.nuxtjs.org/options
*/
axios: {},
/*
** vuetify module configuration
** https://github.com/nuxt-community/vuetify-module
*/
/*
** Build configuration
*/
build: {
extend(config, ctx) {
// Run ESLint on save
if (ctx.isDev && ctx.isClient) {
config.module.rules.push({
enforce: 'pre',
test: /\.(js|vue)$/,
loader: 'eslint-loader',
exclude: /(node_modules)/,
options: {
fix: true
}
})
}
}
}
}