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

Question

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

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

Answer 1

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

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

首先得到偏好 | 语言＆amp;框架 | JavaScript | 代码质量工具 | ESLint 并启用它。您需要定义您的节点解释器＆＃39; ESLint包＆＃39;和可选的配置文件＆＃39;。

接下来转到偏好设置 | 键映射并在那里搜索“＃eslint＆＃39;”。现在您可以添加例如快捷方式＆＃39; control + shift + L＆＃39;。

Answer 2

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

Answer 3

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

在撰写本文时，请注意，您还需要在“设置”或“首选项”菜单中排除<script>标签的缩进。一个很棒的人写了一个short write-up来说明如何做到这一点。

Answer 4

更新：答案已过时。 https://stackoverflow.com/a/46099408/1057218

中描述了最佳解决方案

很遗憾，您无法导入eslint代码样式配置（WEB-19350），但您可以手动配置代码样式。

查看设置：＆＃34;文件|设置|编辑|代码风格|的JavaScript＆＃34;
对于进口大括号： ＆＃34;空间＆＃34; - ＆GT; ＆＃34; ES6导入/导出大括号＆＃34;

Answer 5

我一直在使用的临时修复 是将我的ESLint配置导出到JSCS。它与WebStorm和PHPStorm非常吻合！

我在eslint配置中使用了名为Polyjuice的此程序包和here is the output。

Answer 6

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

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

这样效果很好，并且使工作起来更加容易：）

Answer 7

对于那些仍然有问题的人，我做了上面答案的所有步骤，但根本不起作用。

对我来说，问题是我在终端 (12.x) 中使用的 Node 版本与项目的 .nvmrc 中的 "engine" 和 package.json

在上面指出的两个更改之后，我的 eslint 重新开始工作。

ps：我假设您已安装所有依赖项以及项目根目录中的 .eslintrc.*