TypeScript 自动导入中的 WebStorm/PhpStorm 双引号答案

【问题标题】：WebStorm/PhpStorm double quotes in TypeScript auto importTypeScript 自动导入中的 WebStorm/PhpStorm 双引号
【发布时间】：2017-02-08 07:24:55
【问题描述】：

我使用带单引号的 TypeScript 样式，双引号专门用于 HTML 模板。

WebStorm/PhpStorm 自动导入会添加带有双引号的 import 语句并破坏样式。我想这适用于所有 JetBrains 产品。

如何解决此问题？

【问题讨论】：

像任何 JetBrains 工具中的任何其他语言一样，更改您偏好中的代码样式设置。
那是真的，刚刚找到它，答案提示的地方。首选项中的“报价”搜索没有任何用处。

标签： typescript intellij-idea phpstorm webstorm jetbrains-ide

【解决方案1】：

在2017-2019 中，我们是这样做的：

进入设置
在搜索中输入Code style
选择Typescript
转到Punctuation部分
选择single引号

【讨论】：

【解决方案2】：

第一件事需要检查你的 Tslint 文件

 "quotemark": [
  true,
  "Double"
],

它应该是 Double 而不是 Single，因为它在 Project Build 中通过 TSLint 失败。

现在转到您的设置 |编辑 |打字稿 |标点符号

从下拉列表中选择 Single 并应用/确定。

现在恭喜您的 IntellijIDEA 在 AutoImport 上应用了双引号。

【讨论】：

【解决方案3】：

对于 Intellij 2016.3 版本，它位于其他选项卡 > 生成的代码 > 引号

【讨论】：

【解决方案4】：

此行为由以下选项控制：

Settings/Preferences
Editor | Code Style | TypeScript
"Punctuation" tab | Generated code -> Quote marks

从 2017.1 版本开始，它位于新的 Punctuation 选项卡上，选项名称略有不同：

【讨论】：

如果您从旧版本的 Intellij (
“其他”标签现在是“标点符号”——至少从 Webstorm 2017.3.2 开始
@ggranum 是的，屏幕截图和注释（“在 2017.1...”）显示了这一点。我想我最好让它加粗/更明显。
如果您碰巧将 Vue.js 与 typescript 一起使用，您可能还需要将此设置应用于 javascript。 WebStorm 似乎没有将 typescript 设置应用于 Vue 文件，即使它们设置为 lang=ts。

【解决方案5】：

另外，如果您想在像这样添加导入时在花括号之间添加自动空格

import { MyComponent } from './my.component';

您可以签入标签Spaces | Whithin | ES6 import/export braces

【讨论】：

非常感谢！我一直在寻找它，这让我非常困扰。
和 Ivan 一样，我也不知道如何自定义这个和插值表达式。谢谢！