Grunt-eslint 和启用 `--fix` 标志来自动修复违规答案

【问题标题】：Grunt-eslint & enabling `--fix` flag to auto fix violationsGrunt-eslint 和启用 `--fix` 标志来自动修复违规
【发布时间】：2020-02-23 01:07:17
【问题描述】：

我知道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 标志？

【问题讨论】：

标签： javascript gruntjs eslint grunt-eslint

【解决方案1】：

对于--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'
  ]
}

【讨论】：

你能确认它仍然适用于你的 eslint 3 和 grunt-eslint 吗？谢谢。
这在使用 Grunt 时有效。使用类似选项可用的 package.json 配置时会很好。
如何添加一些规则来修复，我不想用这个修复来解决所有问题：true

【解决方案2】：

添加到答案，如果你不想总是修复，你可以将标志传递给咕噜声

grunt eslint --fix

在 eslint 的 grunt 配置中

eslint: {
  options: {
    fix: grunt.option('fix') // this will get params from the flags
  }
}

所以运行grunt eslint 不会解决任何问题。您必须运行 grunt eslint --fix 才能让 eslint 修复错误。

阅读更多关于grunt.option

【讨论】：

【解决方案3】：

如果没有

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
              }
            })
          }
        }
      }
    }

【讨论】：