编辑器设置
正确配置的编辑器可以使代码更易读和更快地编写。 它甚至可以帮助您在编写错误时发现错误！ 如果这是您第一次设置编辑器，或者您希望调整当前的编辑器，我们有一些建议。
内容预告
- 最受欢迎的编辑器有哪些
- 如何自动格式化代码
你的编辑器
VS Code 是当今最流行的编辑器之一。 它有一个庞大的扩展市场，并与 GitHub 等流行服务很好地集成。 下面列出的大多数功能也可以作为扩展添加到 VS Code 中，使其具有高度可配置性！
React 社区中使用的其他流行的文本编辑器包括：
- WebStorm 是专门为 JavaScript 设计的集成开发环境。
- Sublime Text 支持 JSX 和 TypeScript，内置语法高亮和自动完成功能。
- Vim 是一个高度可配置的文本编辑器，旨在非常高效地创建和更改任何类型的文本。 它作为“vi”包含在大多数 UNIX 系统和 Apple OS X 中。
推荐的编辑器特性
一些编辑器内置了这些功能，但其他编辑器可能需要添加扩展。 检查以确保您选择的编辑器提供了哪些支持！
代码检查
代码检查器会在您编写代码时发现代码中的问题，帮助您及早修复它们。 ESLint 是一种流行的开源 JavaScript linter。
- 使用推荐的 React 配置安装 ESLint（确保安装了 Node！）
- 使用官方扩展在 VSCode 中集成 ESLint
确保你已经为你的项目启用了所有的 eslint-plugin-react-hooks 规则。 它们是必不可少的，可以及早发现最严重的错误。 推荐的 eslint-config-react-app 预设已经包含它们。
格式化
与其他贡献者共享代码时，您最不想做的就是讨论制表符与空格！ 幸运的是，Prettier 将通过重新格式化代码以符合预设的可配置规则来清理您的代码。 运行 Prettier，你所有的制表符都将被转换为空格——你的缩进、引号等也将全部更改以符合配置。 在理想的设置中，Prettier 将在您保存文件时运行，为您快速进行这些编辑。
您可以按照以下步骤在 VSCode 中安装 Prettier 扩展：
- 启动 VS 代码
- 使用快速打开（按 Ctrl/Cmd+P）
- 粘贴到 ext install esbenp.prettier-vscode
- 按回车
保存时格式化
理想情况下，您应该在每次保存时格式化您的代码。 VS Code 有这方面的设置！
- 在 VS Code 中，按 CTRL/CMD + SHIFT + P。
- 输入“设置”
- 回车
- 在搜索栏中，输入“format on save”
- 确保勾选“保存时格式化”选项！
如果您的 ESLint 预设有格式化规则，它们可能会与 Prettier 冲突。 我们建议使用 eslint-config-prettier 禁用 ESLint 预设中的所有格式化规则，以便 ESLint 仅用于捕获逻辑错误。 如果你想强制文件在合并拉取请求之前格式化，请使用 prettier --check 进行持续集成。
网友评论