如何设置更漂亮的逗号选项？答案

【问题标题】：How to set Prettier Comma Options?如何设置更漂亮的逗号选项？
【发布时间】：2023-02-11 19:25:35
【问题描述】：

我很好地使用了更漂亮的自动保存功能。但是只出现了一个问题。

当我保存这段代码时：

header, footer {
  ...
}

prettier 像这样转换它

header,
footer {
  ...
}

我如何禁用此选项？

【问题讨论】：

标签： visual-studio-code prettier

【解决方案1】：

当行宽超过配置的 printWidth (link on prettier documentation link description here)（默认为 80 个字符）时，会出现这种格式设置 (example on prettier.io)。我假设您的示例只是一长行的截断版本，超过 80 个字符。

增加printWidth以避免换行：

// .prettierrc.js
module.exports = {
  printWidth: 120,
}

如果使用 ESLint+Prettier（在 Vue CLI 脚手架项目中），请配置 ESLint 的 prettier/prettier 选项：

// .eslintrc.js
const prettierOptions = require("./prettierrc");

module.exports = {
  rules: {
    "prettier/prettier": ["error", prettierOptions],
  },
};

请注意，Vetur 仅支持格式化整个文档 (vue documentation)，因此格式化所选行在 SFC <script> 块中不起作用。

【讨论】：