Sublime 3 中的 JsPrettier 不单引号 className

Question

我正在使用带有 JSPrettier 的 Sublime Text 3 来格式化 Javascript 和 JSX 代码。

我的 JSPrettier 配置中有以下设置：

// If true, will use single instead of double quotes
"singleQuote": true

即便如此，在格式化代码时 JSPrettier 仍然坚持在 className 和其他 JSX 属性上加上双引号，例如：

<div className="uxm-details-header-buttons">

或

<Icon name="refresh" />

我真的希望所有的东西都用单引号，在特殊情况下保留双引号。

关于如何解决这个问题的任何提示？

Answer 1

目前仅使用更漂亮是不可能的。 JSX 中的引号将始终为双引号，prettier 将忽略此设置。

如果你想了解这个决定背后的动机，你可以阅读这个GitHub 线程。 将 JSX 引号保持为 double 的论点的要点是在整个社区强制实施一种风格，配置选项越少越好。

关于如何解决这个问题的任何提示？

你可以通过prettier-eslint运行你的代码。 这通过eslint --fix格式化您的代码，然后将其结果传递给eslint --fix 。 这样既可以得到prettier 优越的格式化能力的好处，又可以受益于eslint 的配置能力。

Answer 2

在 Sublime Text 3 中，这可以通过修改包的用户首选项部分来实现。 （首选项> 包设置> JSPrettier）

{
"prettier_options": 
  {
  "singleQuote": true
  }
}