当我在Vue组件上执行格式化文档命令时。vue文件VSCode将所有单引号字符串替换为双引号字符串。

在我的具体情况下,该规则与要求单引号的electronic -vue lint配置冲突。

我没有安装更漂亮的扩展(没有更漂亮。singleQuote在我的设置)

如何定制VSCode来避免这种情况?


我没有安装更漂亮的扩展,但在阅读可能重复的答案后,我从头开始添加在我的用户设置(用户设置。json, Ctrl+,快捷方式):

"prettier.singleQuote": true

部分有绿色警告(未知配置设置),单引号不再被替换。

我怀疑更漂亮的扩展是不可见的,但嵌入在Vetur扩展。


对于像我这样的新手:

在顶部导航栏的菜单中:选择“文件->首选项->设置”。 在搜索文本框中,输入Quote 在下面的过滤列表中,寻找齿轮图标,并在它旁边-“Prettier”。点击复选框启用“更漂亮:单引号”


好吧,就像那个家伙(@user2982122)提到的,但不是文件,而是代码->首选项->设置,然后寻找引用,选择更漂亮,并勾选两个框


正如@attdona所指出的,Vetur扩展包括了prettier。

虽然您可以根据接受的答案更改更漂亮的设置,但您也可以更改vue组件特定区域的格式化程序。

例如,在这里,我设置Vetur使用vcode -typescript格式化器,因为它默认使用单引号:


我使用的是typescript,对我来说,它在更漂亮的设置下检查“Tslint集成”标志得到了解决(在vscode首选项中):


从vuejs/vetur发行页面https://github.com/vuejs/vetur/issues/986# 这个解决方案对我很有效。

在vcodes设置中。Json文件添加此条目

"vetur.format.defaultFormatterOptions": {
    "prettier": {
        "singleQuote": true
    }
},

你可以在settings.json中使用它

"javascript.preferences.quoteStyle": "single"

使用这个扩展。

https://marketplace.visualstudio.com/items?itemName=BriteSnow.vscode-toggle-quotes

cmd ' (ctrl '在win/Linux上)将在' ' '中循环


正确解决方法:

我在我的主根项目中添加了. pretierrc .js文件 和写

module.exports = {
    singleQuote: true
  };

看起来这个问题有一个漏洞:更漂亮的漏洞

以上方法对我都没用。 唯一有效的是,在package.json中添加这行代码:

"prettier": {
    "singleQuote": true
  },

对于默认使用.editorconfig文件的项目。格式化程序将忽略设置中的规则并使用.editorconfig中的规则,然后您可以:

删除.editorconfig文件,并使用VSCode设置。 根据您的文件类型,在.editorconfig文件中添加quote_type = single。也可以将quote_type value设置为double或auto。


我在项目文件夹中添加了一个名为。pretierrc的文件。 文件内容:

{
    "singleQuote": true,
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": true
        }
    }
}

我在vscode中也有同样的问题。只需在根目录中创建一个. pretierrc文件,并添加以下json。 对于单引号添加:

{
  "singleQuote": true
}

对于双引号添加:

  {
      "singleQuote": false
  }

试试这些解决方案中的一种

在vscode设置。Json文件添加此条目 ”漂亮。singleQuote”:真正的 在vscode中,如果您有.editorconfig文件,在根符号[*]quote_type = single下添加这一行 在vscode中,如果你有. pretierrc文件,添加这行

{
    "singleQuote": true,
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": true
        }
    }
}

撰写本文时(2022年6月):

请考虑.editorconfig在最后覆盖所有其他配置,找到该文件(很可能在项目的根目录上),编辑它并添加以下内容:

[*]
quote_type = single

对我来说唯一有效的方法是: 并且仅适用于Angular项目:

开始你的项目吧。”Editorconfig "文件,并粘贴'quote_type = single'。 希望这对你也有用。


安装更漂亮的扩展和粘贴下面的代码在你的VSCode设置。json文件

 "prettier.useEditorConfig": false,
 "prettier.singleQuote": true

这将忽略您的.editorconfig文件设置。


它为我工作检查单引号在更漂亮的以及 tslint。autoFixOnSave设为true


对于JSX使用:

{"jsxSingleQuote": false}

quote_type = single

将此添加到.editorconfig中

# EditorConfig is awesome: https://EditorConfig.org

# top-most EditorConfig file
root = true

[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = false
insert_final_newline = false
quote_type = single

对我来说,这两种选择都解决了问题:

通过在。prettierrc - "singleQuote": true中添加 或者在包中添加以下内容。json - - - > "漂亮":{ “singleQuote”:真的 }

虽然我也尝试添加.prettierrc.js和有以下

module。导出= { singleQuote: true };

这并没有起作用。


对我有用的是设置。prettierrc。Json配置文件。把它放在你的项目的根,像这样的示例配置:

{
  "singleQuote": true,
  "trailingComma": "all",
  "tabWidth": 2,
  "semi": true,
  "arrowParens": "always"
}

触发Format Document命令后,一切都能正常工作。

旁注:这个解决方案的一个好处是,由于目前的配置文件,每个团队成员都获得了相同的格式化输出。


在.prettierrc中添加

{
  "arrowParens": "avoid",
  "semi": false,
  "singleQuote": true
}

在我的情况下,问题是在转义\字符内的字符串:

message = 'Error argument is not an object, it\'s ' + typeof error

打开avoidEscape选项并对该字符串使用双引号解决了问题:

message = "Error argument is not an object, it's " + typeof error

.eslintrc.js

module.exports = {
  rules : {
    // Other rules...
    'quotes' : ['error', 'single', {'avoidEscape' : true}],
  }
}

这对我来说很管用: 尝试右键单击当前文档 然后选择format document with, 并为文档选择自己的格式扩展。 :)


After struggling with the issue I found a useful tool. If you click on the Prettier word in the right lower corner you will get the Output window opened. In that window once you run formatting (in my case it is Alt + Shift + F) you will see all the configurations which prettier will use to format the document. So, we can clearly see that specifying the prettier in the prettier.singleQuote is wrong. It should just be singleQuote. Hence, having the .prettierrc file in my user root folder with the following contents produced the desired result:

{
    "trailingComma": "none",
    "useEditorConfig": false,
    "singleQuote": true
}

此外,请确保已安装了Prettier扩展。


我在控制毛边和更漂亮的排版方面有很多问题。我有自己的规矩,让自己看起来更漂亮

"prettier/prettier": [
      "error",
      { "singleQuote": true, "trailingComma": "none" }
    ],

和。prettierrc文件中的规则

{
  "tabWidth": 2
}

但是我的.prettierrc文件没有得到处理。我的解决方案是在开发依赖中安装prettier作为一个包。所以对我有效的解决方案是安装所有这些包eslint-config-prettier eslint-plugin-prettier and prettier。


如果你使用的是YAML插件,它还有一个单引号/双引号选项,这让我很困惑。欢呼。


"漂亮":{ “singleQuote”:真的 },

这行代码节省了我的时间。


首先,安装Prettier扩展。在项目的根目录下创建一个. pretierrc配置文件。并添加如下配置:

{ trailingComma:“es5”, singleQuote:真的, jsxSingleQuote:真的, printWidth: 100, tabWidth: 2, “春天”:真的, “endOfLine”:“auto” 的


我解决这个问题的方法是通过安装禁用eslint中的所有格式化规则 npm i -D eslint-config-prettier,然后在eslint配置文件的extends数组的末尾添加“prettier”

module.exports = {
  env: {
    node: true,
  },
  extends: [
    'airbnb-base',
    'airbnb-typescript/base',
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:@typescript-eslint/recommended-requiring-type-checking',
    'prettier',

  ],
  parser: '@typescript-eslint/parser',
  parserOptions: {
    tsconfigRootDir: __dirname,
    project: ['./tsconfig.json'],
  },
  plugins: ['@typescript-eslint'],
  root: true,
};

然后把它作为我的默认格式化器做得更漂亮