Prettier 不适用于将可视代码中的双引号更改为单引号答案

【问题标题】：Prettier doesn't work for changing double quote to single quote in visual codePrettier 不适用于将可视代码中的双引号更改为单引号
【发布时间】：2017-12-20 19:45:08
【问题描述】：

我在可视化代码中与 EsLint 和 Prettier 合作。没有单引号和双引号，一切正常。

这是我的 .eslintrc 文件： { "parser": "babel-eslint", "plugins": ["prettier"], "rules": { "prettier/prettier": [ "error", { "singleQuote": true } ] } } 当我使用 ctr+ shift+P 并输入“格式化文档”时。双引号没有变成单引号。如果我使用自动修复，它会改变，但是当我保存它时，单引号变成双引号。

我该如何解决这个问题。

【问题讨论】：

我也遇到了这个问题，我在项目中添加了一个问题：github.com/esbenp/prettier-vscode/issues/187

标签： visual-studio-code eslint prettier

【解决方案1】：

由于您已经在更漂亮的配置中设置了singleQuote: true，我怀疑您在 JSX 标记中看到单引号转换为双引号。这是因为 Prettier 对 JSX 有单独的规则：

"jsxSingleQuote": true

没有这个，即使使用"singleQuote": true，Prettier 仍然会将 JSX 中的单引号转换为双引号。

根据 Prettier 的说法，JSX 中的双引号是默认的，因为它源自 HTML，其中双引号更为常见。

在您拥有 Prettier 配置的任何地方设置 "jsxSingleQuote": true，这应该可以解决问题。

【讨论】：

【解决方案2】：

仅当您的字符串中有 ' 时才会发生这种情况，例如（'这是一件事'）。 Prettier 有这个问题，显然没有解决办法。

我的解决方法是，对此类字符串使用 ``（字符串模板语法），对所有其他字符串使用单引号。

`it's a thing`

你不必逃避这个。

【讨论】：

【解决方案3】：

Open Setting and checklist the Prettier: Single Quote

【讨论】：

【解决方案4】：

只需将更漂亮的配置添加到您的 settings.json 可视化代码中。

"prettier.singleQuote": true,

【讨论】：