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
  }
}