Eslint detects formatting errors, but does not fix them at save (Vue/cli 4.2) despite 'lintOnSave: true'

Question

I have recently created a project with Vue/cli 4.2. The problem is that Eslint detects formatting errors (eg. double quotation marks in script, no space between function parentheses), but does not fix them at save despite explicit lintOnSave: true in vue.config.js. It is supposed to be default value, but if I don’t state this setting, eslint will break compilation and throw formatting errors. If I include lintOnSave: true, compilation is performed and errors are just marked in code and listed in terminal. The only errors that are fixed are trailing spaces, but that probably results from .editorconfig settings.

I am working on VS Code. I have the “formatOnSave” option disabled (otherwise VS Code applies it’s own settings). I don’t think it’s a fault of VS Code settings, because if I work on some older projects created with vue-cli 3.7 – they work fine and autoformat is performed correctly. I have compared the settings and they are basically the same (except for lintOnSave: true which is not necessary in the older version).

How can I fix this?

Here are my settings – they might be a bit messy, as I performed a lot of trial-and-error:

1) *** .eslintrc.js

module.exports = {
  root: true,
  env: {
    node: true,
    es6: true
  },
  extends: [
    'plugin:vue/essential',
    '@vue/standard'
  ],
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    indent: ['error', 4],
    semi: ["error", "always"],
    "space-before-function-paren": ["error", "always"],
    quotes: ["error", "single"]
  },
  parserOptions: {
    parser: 'babel-eslint',
    sourceType: "module",
    ecmaVersion: 6
  }
}

2) *** vue.config.js

module.exports = {
  lintOnSave: true, // If I remove this line, Eslint will break compilation and throw formatting errors
  chainWebpack: (config) => {
      config
          .plugin('html')
          .tap(args => {
              args[0].title = 'App title';
              return args;
          });
      config.resolve.alias
          .set('@comp', path.resolve('src/components/'));
  }
};

3) *** .editorconfig

[*.{js,jsx,ts,tsx,vue}]
indent_style = space
indent_size = 4
trim_trailing_whitespace = true
insert_final_newline = true

4) *** package.json

{
  "name": "turniejomat",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.27",
    "@fortawesome/free-solid-svg-icons": "^5.12.1",
    "@fortawesome/vue-fontawesome": "^0.1.9",
    "bootstrap-vue": "^2.1.0",
    "core-js": "^3.6.4",
    "mongodb-stitch-browser-sdk": "^4.8.0",
    "vue": "^2.6.11",
    "vue-router": "^3.1.5",
    "vuex": "^3.1.2"
  },
  "devDependencies": {
    "@babel/polyfill": "^7.7.0",
    "@vue/cli-plugin-babel": "~4.2.0",
    "@vue/cli-plugin-eslint": "~4.2.0",
    "@vue/cli-plugin-router": "~4.2.0",
    "@vue/cli-plugin-vuex": "~4.2.0",
    "@vue/cli-service": "~4.2.0",
    "@vue/eslint-config-standard": "^5.1.0",
    "babel-eslint": "^10.0.3",
    "bootstrap": "^4.3.1",
    "eslint": "^6.7.2",
    "eslint-plugin-import": "^2.20.1",
    "eslint-plugin-node": "^11.0.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^6.1.2",
    "mutationobserver-shim": "^0.3.3",
    "node-sass": "^4.12.0",
    "popper.js": "^1.16.0",
    "portal-vue": "^2.1.6",
    "sass": "^1.19.0",
    "sass-loader": "^8.0.2",
    "vue-cli-plugin-bootstrap-vue": "~0.6.0",
    "vue-template-compiler": "^2.6.11"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

I'll appreciate any hints how to fix the lack of auto formatting.