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

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

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

58526 次浏览

小开

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

Unfortunately you cannot import eslint code style configuration (WEB-19350) but you can configure the code style manually.

See the settings: “文件 | 设置 | 编辑器 | 代码样式 | JavaScript”
对于导入花括号: “空格”-> “ ES6导入/导出花括号”

小开

I have just installed WebStorm 2017 and I do not know if this works for WS 2016. Instead of pressing Option + Command + L, to reformat your code, you could press Option + Enter when your cursor is close to an ESLint error. This will open up the context menu, then select the "ESLint: Fix current file"

小开

A temporary fix 暂时而已 that I've been using is to export my ESLint config to JSCS. It works pretty nicely with WebStorm and PHPStorm!

我在 eslint 配置中使用了这个名为 Polyjuice和这是输出的包。

小开

(描述的步骤和截图来自 IntelliJ IDEA 2017.2)

你可以在“修复 ESLint 问题”的操作中添加一个快捷键。

首先到达偏好 | 语言及架构 | JavaScript | Code Quality Tools | 埃斯林特并启用它。您将需要定义您的“节点解释器”，“ ESlint 包”和可选的“配置文件”。

接下来转到偏好 | 钥匙图并在那里搜索“ eslint”。现在可以添加快捷方式“ control + shift + L”。

小开

最好的方法是使用宏来实现自动化。

1. 转到 < em > 编辑 | 宏 | 开始宏录制
2. Go to File | Save All
3. 按 Strg + Shift + A
4. 搜索 eslint 并运行它。
5. 转到 编辑 | 宏 | 停止宏录制
转到 Edit | Macro | Edit Macros移除除了两个 行动: ..。以外的所有东西
7. 转到 File | Settings | Keymap | Macros，在宏 < br > < br > 上添加 Strg + S 这种方法非常有效，而且工作起来也容易得多:)

小开

如果您正在使用像我这样的新版本的 WebStorm，您可以通过右键单击 .eslintrc.js(或其他 ESLint 配置文件) ，然后单击“ Apply ESLint Code Style Rules”选项，如图给你所示，将 ESLint 规则导入 WebStorm。

请注意，在写作时，您还需要排除“设置”或“首选项”菜单中 <script>标签的缩进。一个了不起的家伙写了一本简短记录教你怎么做。

小开

对于那些仍然有困难的人，我做了上面所有的步骤的答案，但是根本没有工作。

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

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

P.s: 我假设您已经在项目的根目录中安装了所有的依赖项以及 .eslintrc.*

小开

最佳答案

2021年为我解决了这个问题:

Webstorm 正在使用 更漂亮软件包，有一个选项:

Preferences | Languages & Frameworks | JavaScript | Prettier -> On 'Reformat Code' action

现在 Webstorm 使用 eslint规则来重新格式化 Reformat Code热键上的代码。