如何根据eslint制作WebStorm格式代码？

76

我已经为WebStorm项目指定了eslint配置。但这似乎不适用于代码重新格式化功能。例如，它继续格式化import { something } from 'somewhere'为import {something} from 'somewhere'。

有没有办法使WebStorm根据eslint配置格式化代码？

webstorm eslint

— 西伯利亚人
source

142

（描述的步骤和屏幕截图来自IntelliJ IDEA 2017.2）

您可以为操作“修复ESLint问题”添加键盘快捷键。确保已安装并启用了插件“ JavaScript支持”。

首先进入首选项| 语言和框架| JavaScript | 代码质量工具| ESLint并启用它。您将需要定义“节点解释器”，“ ESlint程序包”和可选的“配置文件”。

接下来转到首选项| 键映射，然后在其中搜索“ eslint”。现在，您可以添加快捷方式“ control + shift + L”。

— phse
source

1

大！谢谢！

— Bohdan Didukh

4

这应该是最好的答案。

— 胡亚雄

1

这也适用于Webstorm。谢谢。

— 艾哈迈德·哈桑宁

1

我认为这是推荐的答案，因为当我们在团队项目中工作时，由于VCS问题，我只想修复当前文件，而不想运行eslint命令并修复整个项目。

— hermeslm

8

IntelliJ没有意识到已配置eslint并选择将其用作默认格式化程序，这是非常愚蠢的。就像VS Code一样。

— 萨斯曼

31

我刚刚安装了WebStorm 2017，但不知道这是否适用于WS2016。当光标接近ESLint错误时，可以按Option + Enter而不是按Option + Command + L来重新设置代码格式。这将打开上下文菜单，然后选择“ ESLint：修复当前文件”

— 奥维德·哈伯斯塔德
source

4

这只是eslint --fix <path-to-current-file>为您运行。

— 罗里·奥肯

12

更新：答案已过时。最佳解决方案在https://stackoverflow.com/a/46099408/1057218中进行了描述

不幸的是，您不能导入eslint代码样式配置（WEB-19350），但是可以手动配置代码样式。

请参阅设置：“文件|设置|编辑器|代码样式| JavaScript”
对于导入括号： “空格”->“ ES6导入/导出括号”

— Anstarovoyt
source

9

如果您正在使用WebStorm较新版本的我一样，你可以通过在右键单击导入ESLint规则到WebStorm .eslintrc.js（或其他ESLint配置文件），然后点击“应用ESLint代码样式规则”选项，如图所示这里。

请注意，在撰写本文时，还需要<script>在“设置”或“首选项”菜单中排除标签的缩进。一个很棒的家伙写了一篇简短的文章来介绍如何做到这一点。

— 尼克拉斯
source

1

现在的临时修复，我一直在使用的是将ESLint配置导出到JSCS。它与WebStorm和PHPStorm很好地配合！

我使用了这个名为Polyjuice的软件包，这是我的eslint配置的输出。

— 卡梅伦
source

现在，WebStorm确实支持“开箱即用”的ESLint，它可以按预期工作以帮助您设置代码样式，请参阅jetbrains.com/webstorm/whatsnew/#v2017-2-eslint

— Cameron

0

最好的方法是使用宏将其自动化。

1.转到编辑| 宏| 开始宏录制
2.转到文件| 保存所有
3.按Strg + Shift + A
4.搜索eslint并运行它。
5.转到编辑| 宏| 停止宏录制
6.转到编辑| 宏| 编辑宏并删除所有需要执行以下两项操作的操作：...
7.转到文件| 设置| 按键图| 宏，并在宏上添加Strg +S。

这很好用，并且使工作起来更加容易:)

— 里昂338
source