Vue @click="show = true" 错误 将 `show·=·true` 替换为 `(show·=·true)` eslint(prettier/perttier)

Question

错误

@click="show = true"

使固定

@click="(show = true)"

.eslintrc.js

module.exports = {
  root: true,
  extends: [
    'eslint:recommended',
    'plugin:vue/strongly-recommended',
    'standard',
    'plugin:prettier/recommended',
  ],
  parserOptions: {
    ecmaVersion: 'latest',
    sourceType: 'module',
  },
  plugins: ['simple-import-sort', 'import'],
  rules: {
    'simple-import-sort/imports': 'error',
    'simple-import-sort/exports': 'error',
    'import/newline-after-import': 'error',
    'vue/multi-word-component-names': 'off',
  },
}

.prettierrc.js

/** @type {import('prettier').Config} */
module.exports = {
  singleQuote: true,
  printWidth: 100,
  tabWidth: 2,
  useTabs: false,
  semi: false,
  trailingComma: 'all',
  endOfLine: 'auto',
  htmlWhitespaceSensitivity: 'ignore',
  overrides: [
    {
      files: '*.json',
      options: {
        trailingComma: 'none',
      },
    },
  ],
}

版本 "eslint": "^8.57.0", "eslint-config-prettier": "^9.1.0", "eslint-plugin-prettier": "^5.1.3", “更漂亮”：“^3.3.2”，

更漂亮的规则是什么？

Answer 1

在 Prettier v3.4.0 中，事件处理程序的格式存在问题。如果您有以下代码：

<button @click="show = true"></button>

Prettier 想要将其格式化为：

<button @click="(show = true)"></button>

这是 v3.4.1 中修复的错误，请参阅变更日志。 更新 prettier 版本后，prettier 应该不会再抱怨格式了。