Setting Format Vue Templates By Prettyhtml But Not Follow Eslint

[MarkSky]

Info

• Platform: Windows 10
• Vetur version: 0.22.0
• VS Code version: 1.37.0

Problem

I have set

"vetur.format.defaultFormatter.html": "prettyhtml"

, but every time when I save the file, I got errors:

1. Expected indentation of 20 spaces but found 0 spaces. eslint(vue/html-indent)
2. Expected a space before '/>', but not found. eslint(vue/html-closing-bracket-spacing)

I want to use Prettyhtml to format my code, but using the eslint-plugin-vue rule.
Could Vetur support to setting format code by using eslint-plugin-vue rule in Prettyhtml?

Reproducible Case

VSCode settings.json

{
    "breadcrumbs.enabled": true,
    "css.validate": false,
    "editor.fontFamily": "Source Code Pro, Consolas, Microsoft JhengHei UI, 微軟正黑體, Microsoft JhengHei, Microsoft YaHei UI, 微软雅黑体, Microsoft YaHei, Hiragino Sans GB, Meiryo UI, ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, Arial",
    "editor.fontSize": 16,
    "editor.formatOnSave": true,
    "editor.formatOnPaste": true,
    "editor.lineHeight": 24,
    "editor.minimap.maxColumn": 60,
    "editor.renderIndentGuides": true,
    "eslint.alwaysShowStatus": true,
    "eslint.autoFixOnSave": true,
    "eslint.options": {
        "extensions": [".html", ".js", ".jsx", ".vue"]
    },
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "vue",
            "autoFix": true
        }
    ],
    "extensions.autoUpdate": false,
    "files.associations": {
        "*.js": "javascript",
        "*.scss": "scss",
        "*.vue": "vue",
        ".prettierrc": "json",
        ".stylelintrc": "json"
    },
    "gitlens.advanced.messages": {
        "suppressShowKeyBindingsNotice": true
    },
    "gitlens.hovers.currentLine.over": "line",
    "gitlens.views.repositories.files.layout": "list",
    "gitlens.views.repositories.location": "scm",
    "gitlens.views.fileHistory.location": "explorer",
    "gitlens.views.lineHistory.location": "explorer",
    "gitlens.views.compare.location": "gitlens",
    "gitlens.views.search.location": "gitlens",
    "html.format.enable": false,
    "prettier.disableLanguages": ["vue"],
    "prettier.eslintIntegration": true,
    "prettier.singleQuote": true,
    "prettier.stylelintIntegration": true,
    "prettier.tabWidth": 4,
    "prettier.trailingComma": "all",
    "vetur.format.defaultFormatter.html": "prettyhtml",
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": true,
            "stylelintIntegration": true,
            "tabWidth": 4
        },
        "prettyhtml": {
            "tabWidth": 4,
            "wrapAttributes": true
        }
    },
    "vetur.format.options.tabSize": 4,
    "vetur.format.scriptInitialIndent": true,
    "vetur.format.styleInitialIndent": true,
    "xmlTools.enforcePrettySelfClosingTagOnFormat": true,
    "window.zoomLevel": 0.5,
    "workbench.iconTheme": "vscode-icons",
    "workbench.colorTheme": "One Dark Flatland Monokai",
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[json]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    }
}

.eslintrc.js

module.exports = {
    root: true,
    env: {
        browser: true,
        node: true,
    },
    extends: [
        'plugin:vue/essential',
        'plugin:vue/strongly-recommended',
        'eslint:recommended',
        'plugin:vue/recommended',
    ],
    rules: {
        'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
        'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
        'vue/html-closing-bracket-newline': ['error', { multiline: 'never' }],
        'vue/html-closing-bracket-spacing': 'error',
        'vue/html-indent': ['error', 4],
        'vue/html-self-closing': [
            'error',
            { html: { void: 'always', normal: 'never' } },
        ],
        'vue/max-attributes-per-line': [
            'error',
            { singleline: 1, multiline: { max: 1, allowFirstLine: true } },
        ],
        'vue/script-indent': ['error', 4, { baseIndent: 1, switchCase: 1 }],
        'vue/singleline-html-element-content-newline': [
            'error',
            { ignores: ['router-link'] },
        ],
    },
    parser: 'vue-eslint-parser',
    parserOptions: {
        parser: 'babel-eslint',
        ecmaVersion: 2018,
        sourceType: 'module',
    },
};