Visual Studio Code - 调整导入报价设置答案

【问题标题】：Visual Studio Code - Adjust import quotation settingVisual Studio Code - 调整导入报价设置
【发布时间】：2017-08-14 14:45:18
【问题描述】：

在 Visual Studio Code 中使用 TypeScript 时，对类型的导入建议（由空格 + 句点触发）将使用双引号生成导入。

我们的 TypeScript linter 会验证是否在可能的情况下使用了单引号。

如下所示，该建议带有双引号 ("@angular/...")

如何调整导入的设置？

【问题讨论】：

marketplace.visualstudio.com/…

标签： typescript visual-studio-code

【解决方案1】：

从 VSCode 1.10 开始，这（遗憾的是）还不可能。但是对于许多用户来说似乎是一个问题。 VSCode 主题已经意识到了这个问题，你可以按照这个来了解它何时实现：https://github.com/Microsoft/TypeScript/issues/13270

2018 年 6 月更新

自 VSCode 1.24（2018 年 6 月）以来，有一个选项！

"typescript.preferences.quoteStyle": "single"

【讨论】：

"typescript.preferences.quoteStyle": "single"
这似乎对我不起作用。我仍然从建议和 sn-ps 中得到双引号。
和我一样，在所有可能的级别（用户、工作区、项目）上都发生了变化，但仍然有双引号 :(
我不知道你们两个使用的是什么语言，但是 javascript 和 typescript 有单独的设置。我想知道同样的事情，但我设置了 javascript 代码设置而不是 typescript。

【解决方案2】：

您还可以在 vscode 用户设置中配置以下行来调整此设置。

"prettier.singleQuote": true

【讨论】：

prettier 是一个扩展，不是每个人都用它
令人沮丧的是人们认为您拥有或想要使用 Prettier。除非有人问“我如何使用 Prettier”——我认为最好不要在假设他们拥有的情况下回答。
@TsarBomba 你是对的。此设置需要 Prettier 扩展来调整报价。 marketplace.visualstudio.com/…

【解决方案3】：

我使用Editor config 修复了这个问题，在您的项目根目录中打开您的 .editorconfig 文件（如果没有，请创建该文件）并在 [ 之后添加这一行*]

[*]
...
quote_type = single

在wiki 中，您可以看到完整的属性列表。

【讨论】：

赞成。仅将更改限制在您正在处理的项目与全局范围内。附加说明：重新启动 VS Code 以使更改生效。
只是评论一下，在 VS Code 中，您也可以设置特定于该项目的工作区设置。如果您想在文件中的其他地方使用其他类型，这将允许您在导入时专门使用单引号/双引号。 .editorconfig 更改将在项目范围内进行。

【解决方案4】：

从 VS Code 1.21.1 开始，您需要编辑

/usr/share/code/resources/app/extensions/typescript-basics/sn-ps/typescript.json

在 Windows 中

/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/typescript-basics/sn-ps/typescript.json。

在 Windows 10 中（vscode 版本 1.30.*（用户设置）更高版本）

*C:\Users\\AppData\Local\Programs\Microsoft VS Code\resources\app\extensions\typescript-basics\sn-ps\typescript.json

在该文件的“导入外部模块”部分中，将 body 数组属性设置为值 "import { $0 } from '${1:module}';" 该部分将如下所示：

"Import external module.": {
    "prefix": "import statement",
    "body": [
        "import { $0 } from '${1:module}';"
    ],
    "description": "Import external module."
},

【讨论】：

这个解决方案对我有用。从字面上尝试了一切，但只有这个解决了它。
这里也一样。从字面上尝试所有其他解决方案。这是唯一一个解决了我的问题。

【解决方案5】：

支持此配置的替代方法是TypeScript Toolbox。

可通过设置genGetSet.pathStringDelimiter 进行配置，默认情况下已经具有单引号导入。

【讨论】：

谢谢！值得指出 genGetSet.spacedImportLine 设置以及新的导入行看起来像 import { Router }.... 而不是默认的 import {Router}...
上面的答案和评论都是很好的信息！谢谢你们两个！

【解决方案6】：

转到“文件>首选项>设置”，然后在用户设置下添加：

"typescript.preferences.quoteStyle": "single",
"javascript.preferences.quoteStyle": "single"

【讨论】：

为我工作，谢谢！顺便说一句，您可以添加指向提供这些选项的默认设置的链接：code.visualstudio.com/docs/getstarted/settings。 // Preferred quote style to use for quick fixes: 'single' quotes, 'double' quotes, or 'auto' infer quote type from existing imports. Requires using TypeScript 2.9 or newer in the workspace.

【解决方案7】：

从 TypeScript 2.5 开始，将扫描文件中的第一个导入或导出语句，以确定在使用导入建议时是使用单引号还是双引号。

https://github.com/Microsoft/TypeScript/pull/17750

【讨论】：

【解决方案8】：

您还可以在 vscode 用户设置中配置以下行以允许在字符串中使用单引号。

转到首选项>用户设置

"prettier.singleQuote": true

这将允许在字符串中使用单引号。否则，如果您手动将所有双引号更改为单引号，它将在保存时恢复。另外，添加

"tslint.autoFixOnSave": true

在保存时自动修复。

【讨论】：

【解决方案9】：

这已经实现（正如另一个回复中提到的）！但是你可能还没有使用最新版本的 TypeScript。

解决方法很简单：

点击右下角“TypeScript”和小笑脸之间的TypeScript版本号（例如2.3.4）。然后切换到 Visual Studio Code 内置版本（此时为 2.5.3）。

在此之后，Visual Studio 代码将通过查看第一个导入语句来推断导入引用样式。请注意，无论如何，一个小的弹出标签仍会显示双引号。

Bug report

Relevant pull request:

这增加了确定是否对通过代码修复添加的新导入使用单引号或双引号的能力。添加新导入时，我们会扫描源文件的最顶层语句以查找带有模块说明符的现有导入或导出声明。然后我们使用我们找到的第一个引用样式。如果文件中没有现有的导入，我们将使用双引号。

【讨论】：

【解决方案10】：

以上解决方案对我不起作用

所以这是我的解决方法，在你使用 vscode 时，"tslint.autoFixOnSave": true 在你的settings.json 中会在你保存文件时自动修复这些导入引用。

【讨论】：

说Unknown Configuration Setting

【解决方案11】：

打开命令面板（Ctrl+Shift+P - Windows），浏览Configure User Snippets

选择typescript.json (TypeScript)

将此 sn-p 粘贴到您的列表中：

"Import external module.": {
    "prefix": "import statement",
    "body": [
        "import { $0 } from '${1:module}';"
    ],
    "description": "Import external module."
}

不客气：

【讨论】：