ruby on rails_vs Rails开发人员的Ruby代码扩展

最新推荐文章于 2024-09-25 20:31:51 发布

weixin_26712121

最新推荐文章于 2024-09-25 20:31:51 发布

阅读量215

点赞数

文章标签： java python

原文链接：https://medium.com/better-programming/vs-code-extensions-for-ruby-on-rails-developers-917474e03e04

版权

ruby on rails

Ruby is built with developer happiness in mind. However, if your editor is not correctly set up, you’re in for a painful ride. Finding the right extensions on VS Code can take you down a long trial-and-error path.

Ruby的构建考虑了开发人员的快乐。但是，如果您的编辑器设置不正确，那将是一个痛苦的旅程。在VS Code上找到正确的扩展名可以带您走很长的反复试验之路。

Here’s a list of powerful extensions for Ruby on Rails developers.

这是Ruby on Rails开发人员的强大扩展的列表。

TL; DR (TL;DR)

Ruby (Ruby)

Ruby
Ruby
Ruby Solargraph
Ruby太阳摄影
Endwise
最终
ERB Helper tags
ERB Helper标签
Rails DB Schema
Rails数据库架构
Rubocop
鲁科科普
ERB Formatter
ERB格式器
Emmet in ERB
ERB中的Emmet

一般 (General)

Atom Dark Theme
原子暗主题
VSCode-icons
VSCode图标
DotENV
环保网
Output Colorizer
输出着色器
Auto Rename Tag
自动重命名标签
Highlight Matching Tag
高亮匹配标签
Bracket Pair Colorizer 2
支架对着色器2

Ruby (Ruby)

1. Ruby (1. Ruby)

This speaks for itself. Ruby syntax highlighting.

这是不言而喻的。 Ruby语法突出显示。

2. Ruby太阳图 (2. Ruby Solargraph)

Intelligent code completion and documentation while you’re writing code.

编写代码时智能地完成代码和编写文档。

3. 最后 (3. Endwise)

Be wise and never forget to close the end immediately.

要明智，永远不要忘记立即结束结局。

4. ERB助手标签 (4. ERB Helper Tags)

Useful shortcuts to save you time.

有用的快捷方式可以节省您的时间。

5. Rails数据库模式 (5. Rails DB Schema)

Get quick insight on the defined database schema while you’re typing.

键入时快速了解已定义的数据库模式。

6. Rubocop (6. Rubocop)

Code formatter for writing Ruby.

用于编写Ruby的代码格式化程序。

If you’re running into the following error, follow this guide to link the right execution path:

如果您遇到以下错误，请按照本指南链接正确的执行路径：

rubocop is not excutable 
execute path is empty!

7. ERB格式化程序/美化 (7. ERB Formatter/Beautify)

Not being able to indent your html.erb files in VS Code can be a real pain. ERB Formatter depends on the htmlbeautifier gem, so we need to install that dependency too.

无法在VS Code中缩进html.erb文件可能是一个真正的痛苦。 ERB Formatter取决于htmlbeautifier gem，因此我们也需要安装该依赖项。

gem install htmlbeautifier

"files.associations": {
  "*.erb": "erb"
},
"[erb]": {
  "editor.defaultFormatter":"aliariff.vscode-erb-beautify" ,
},
"[html]": {
  "editor.defaultFormatter": "aliariff.vscode-erb-beautify",
},
"files.associations": {
  "*.erb": "erb"
},

8. ERB中的Emmet (8. Emmet in ERB)

It’s not an extension, yet it’s something you really want. If you’re writing html.erb files, you want to have access to the available emmet in HTML. It requires this setup:

它不是扩展，而是您真正想要的。如果要编写html.erb文件， html.erb访问HTML中可用的emmet。它需要以下设置：

"emmet.includeLanguages": {
        "erb": "html"
      },
"emmet.showAbbreviationSuggestions": true,
"emmet.showSuggestionsAsSnippets": true

一般 (General)

1. 原子一黑暗主题 (1. Atom One Dark Theme)

The theme of your editor is a personal choice. Choose what’s pleasant to your eyes and provides useful syntax highlighting. Alternatively, check Material Theme.

编辑器的主题是个人选择。选择令您满意的内容，并提供有用的语法突出显示。或者，检查“材质主题”。

2. VS代码-图标 (2. VS Code — Icons)

Beautiful icons make it easy to distinguish between folder and file types.

漂亮的图标可轻松区分文件夹和文件类型。

3. DotENV (3. DotENV)

Syntax highlighting for your .env file.

.env文件的语法突出显示。

4. 输出着色器 (4. Output Colorizer)

Make it easy to read through the logs with colorised log files.

易于阅读带有彩色日志文件的日志。

5. 自动重命名标签 (5. Auto Rename Tag)

Save yourself 50% of the time spent selecting closing tags.

为您节省50％的时间选择结束标记。

6. 高亮显示匹配标签 (6. Highlight Matching Tag)

Spot opening and closing tags immediately. I’ve also added some optional custom config to highlight both the left and right chevron (< …. >) when selecting a tag.

立即发现打开和关闭标签。我还添加了一些可选的自定义配置，以在选择标签时突出显示左和右V形( < …. > )。

"highlight-matching-tag.enabled": true,
"highlight-matching-tag.styles": {
   "opening": {
     "left": {
       "custom": {
         "borderWidth": "0 0 0 1px",
         "borderStyle": "solid",
         "borderColor": "yellow",
         "overviewRulerColor": "white"
       }
     },
     "right": {
       "custom": {
         "borderWidth": "0 1px 0 0",
         "borderStyle": "solid",
         "borderColor": "yellow",
         "overviewRulerColor": "white"
       }
     },
     "name": {
       "underline": "yellow"
     }
   }
 }

7. 支架对着色器2 (7. Bracket Pair Colorizer 2)

JavaScript syntax highlighting and formatting are extensively covered in VS Code. Depending on the framework you use, you might want to add other extensions too.

VS Code广泛介绍了JavaScript语法突出显示和格式设置。根据您使用的框架，您可能还想添加其他扩展。