I'm migrating an application from Vue 2 to 3. After a mess with a lot of peer depencies errors, my project finally builds up but the new version of WebPack think that EsLint error are real errors and stop the build if for example, there is variable declared but not used.

I'm aware that I can disable that behavior by setting the flag failOnError to false. But I can't figure out where I should write it. I do not have a webpack.config.js file it seams Vue.JS handle it for me so I've the following vue.config.js file:

const webpack = require('webpack')

module.exports = {
  configureWebpack: {
    devtool: 'eval-source-map',
    plugins: [
      new webpack.ProvidePlugin({
        _: 'lodash'
      })
    ]
  },

  publicPath: '',

  pluginOptions: {
    cordovaPath: 'src-cordova'
  },
  
  devServer: { https: false }
}

Is it the right place? Should I create a webpack.config.js file?

PS: If you need more informations, then just leave a comment :)

CodePudding user response：

In a Vue CLI 5 scaffolded project (with Webpack 5), you can disable the EslintWebpackPlugin 's failOnError via Vue CLI's chainWebpack option.

1. In chainWebpack(config), use config.plugin('eslint') to get the EslintWebpackPlugin.

2. Chain a .tap(args) call to modify the plugin's arguments (args is an object array in this case). The first argument is the options object for the plugin. Set that object's failOnError property to false:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  chainWebpack(config) {
    config.plugin('eslint')
          .tap(args => {
            args[0].failOnError = false
            return args
          })
  },
})