为什么 Prettier 在解构赋值之前声明 `;`？

Question

我的 Angular 组件中有 if 块：

if (desc.length > 0) {
    [this.errorMsg] = desc
}

但是，Prettier 不喜欢它，建议将; 放在解构赋值的开头：

if (desc.length > 0) {
    ;[this.errorMsg] = desc
}

我只想得到为什么？我的 ESLint 或 Prettier 配置是否存在错误？还是有原因？

添加
.eslintrc.json：

{
  "overrides": [
    {
      "files": ["*.ts"],
      "parserOptions": {
        "project": [
          "tsconfig.*?.json",
          "e2e/tsconfig.e2e.json"
        ],
        "createDefaultProgram": true
      },
      "extends": [
        "plugin:@angular-eslint/recommended",
        // AirBnB guide style
        "airbnb-typescript/base",
        // Prettier settings
        "prettier",
        "plugin:prettier/recommended"
      ],
      "rules": {
        /**
         * Any TypeScript source code (NOT TEMPLATE) related rules you wish to use/reconfigure over and above the
         * recommended set provided by the @angular-eslint project would go here.
         */
        "@angular-eslint/directive-selector": [
          "error",
          { "type": "attribute", "prefix": "app", "style": "camelCase" }
        ],
        "@angular-eslint/component-selector": [
          "error",
          { "type": "element", "prefix": "app", "style": "kebab-case" }
        ]
      }
    },
    // NOTE: WE ARE NOT APPLYING PRETTIER IN THIS OVERRIDE, ONLY @ANGULAR-ESLINT/TEMPLATE
    {
      "files": ["*.html"],
      "extends": ["plugin:@angular-eslint/template/recommended"],
      "rules": {}
    },
    // NOTE: WE ARE NOT APPLYING @ANGULAR-ESLINT/TEMPLATE IN THIS OVERRIDE, ONLY PRETTIER
    {
      "files": ["*.html"],
      "excludedFiles": ["*inline-template-*.component.html"],
      "extends": ["plugin:prettier/recommended"],
      "rules": {
        // NOTE: WE ARE OVERRIDING THE DEFAULT CONFIG TO ALWAYS SET THE PARSER TO ANGULAR (SEE BELOW)
        "prettier/prettier": ["error", { "parser": "angular" }]
      }
    }
  ]
}

.prettierrc.json:

{
  "singleQuote": true,
  "tabWidth": 2,
  "printWidth": 120,
  "semi": false
}

Answer 1

如果您有兴趣阅读原因

，已经收到关于此主题的bunch of discussion

即使不是严格要求，更漂亮的在开头添加分号的原因是它可以更轻松地在文件中移动代码行，而不会意外引入 ASI 问题。 - azz

编辑： Prettier 也确实解释了here的原因

但基本上，这是因为

someCall()
[a] = obj

不一样

someCall();
[a] = obj

但是既然你要求prettier去掉分号，那么它就放在开头了

someCall()
;[a] = obj

你也可以阅读standardjs rules about the subject 上面写着

// ✓ ok
;[1, 2, 3].forEach(bar)

// ✗ avoid
[1, 2, 3].forEach(bar)