👩‍💻 在 VS Code 中进行 Rails 开发所需的三个扩展

Ruby 和 Ruby On Rails VS Code 扩展

团队配置策略

缺少的功能

其他有用的 VS Code 扩展

本文摘录自《Rails 6：缺失的开发人员设置指南》

大家好👋，欢迎！在这里，您将学习如何设置 Visual Studio Code 进行 Ruby 和 Ruby On Rails 开发。VS Code 是我的首选编辑器，并且在整个开发领域越来越受欢迎。甚至连 Facebook 也曾构建过自己的Atom 扩展 Nuclide，并在 2019 年转向了 VSCode。

Ruby 2019 开发者生态系统现状中还展示了其他一些流行的 Ruby 和 Ruby On Rails 编辑器，例如RubyMine。如果您使用过，请在评论中告诉我。

至于 VS Code 中的扩展，有很多与 Ruby 和 Rails 相关的。我都试过了，所以就把这篇文章分享出来，这样你就不用跑十个不同的博客去找合适的扩展了。

现在让我们配置 VS Code！

目录：

• Ruby 和 Ruby On Rails VS Code 扩展
  • 末端
  • 红宝石太阳图
  • 宝石透镜
• 团队配置策略
  • 建议扩展
  • 工作区设置
• 缺少的功能
• 其他有用的 VS Code 扩展

Ruby 和 Ruby On Rails VS Code 扩展

至于 Ruby 和 Rails 开发，我只会用这些扩展。目前来说，它们提供了最好的设置。

末端

我们先从一个简单的扩展开始，它可以在需要的地方巧妙地添加end代码块。我认为这应该在 VS Code 中默认实现，但事实并非如此。它看起来如下：

动图

红宝石太阳图

现在来聊点重头戏。如果你习惯了 VS Code 强大的 JavaScript 自动补全功能，那么你一定会喜欢 Solargraph 及其 VS Code 扩展。

Solargraph 是一个 Ruby 宝石，通过 Microsoft 的solargraph.org提供智能感知功能。

Solagraph 可以做的更多，我特别喜欢使用RuboCop进行的 linting 和自动格式化，请参阅：

要利用 Solargraph 功能，您必须将依赖项添加到 Gemfile 中：

gem 'solargraph', group: :development

如果您要使用 RuboCop 功能，那么您还需要添加此依赖项：

gem 'rubocop', group: :development

最后，您可以进一步配置 Solargraph，使其与您的 Rail 代码库更加智能。

宝石透镜

当你想快速查看某个 gem 的描述和最新版本时，这个扩展非常有用Gemfile。参见：

团队配置策略

作为开发者，我的目标是以最佳方式配置我的编辑器，同时确保此配置存储在项目中，并可供其他开发者使用。即使有时会造成一些麻烦，但最好让同一项目中的所有贡献者都使用相同的编辑器和配置。这样您就可以专注于构建应用程序，而不是为代码检查和格式化配置 10 个不同的编辑器。

现在，为了实现这一点，VS Code 具有简洁的功能，可让您：

1. 建议扩展
2. 自动应用某些设置

这一切都是通过VS Code 工作区设置完成的，因此我们将使用它。

您所要做的就是在项目中创建一个文件夹：.vscode

建议扩展

让我们建议一下我们之前见过的三个扩展：

.vscode/extensions.json

{
  "recommendations": [
    "kaiwood.endwise",
    "ninoseki.vscode-gem-lens",
    "castwide.solargraph"
  ]
}

任何在 VS Code 中打开你的项目的人都会看到以下内容：

工作区设置

您还可以在 VS Code 中强制执行项目的某些设置。通常，您需要这样做才能：

1. 轻松设置新环境/新团队成员
2. 轻松在任何持续集成系统上强制执行一些默认的 linting/格式化。以下是我针对我们见过的三个扩展的设置：

.vscode/settings.json

{
  "files.associations": {
    "*.html.erb": "html"
  },
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "editor.formatOnSave": true,
  "solargraph.autoformat": true,
  "solargraph.diagnostics": true,
  "solargraph.formatting": true
}

这将配置 Solargraph 进行 linting 和自动格式化，以及.html.erb自动格式化。

缺少的功能

目前，文件的 lint、语法高亮和自动格式化功能状态.*.erb非常糟糕。所以我选择了一个简单的解决方案，将这些文件视为输出格式（HTML、CSS）。最终，也许Prettier及其Ruby 插件会是最好的选择，但目前它还不支持格式化.html.erb。

其他有用的 VS Code 扩展

这些是我使用并安装的扩展：

• DotENV
• VS Code 的 EditorConfig
• 文件实用程序
• GitHub Plus Theme 是本文截图中使用的主题，也是我每天使用的主题
• gitignore
• GitLens
• 赫罗库
• 当地历史
• 设置同步
• Travis CI 状态

🔚 就是这样！

有没有一些你离不开的扩展，尤其是 Rails 的扩展？给我留言，我会更新这篇文章！

感谢您的阅读，如果您喜欢这篇文章，请分享给其他人发现它：