Html 如何在 VS Code 中自动格式化 Ruby 或 .erb 文件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/41051423/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I auto format Ruby or .erb files in VS Code?
提问by Derek
I press ?+ ?+ Fin Visual Studio Code for macOS, the shortcut to Format Document, to format a file called foo.rbor foo.html.erb.
我按?+ ?+F在Visual Studio代码为MacOS，快捷方式格式文档，格式化一个名为foo.rb或foo.html.erb。
Instead of formatting the document it prints out this letter: ?
它打印出这封信，而不是格式化文档： ?
How do I get it to format the document?
我如何让它格式化文档？
回答by Никита Львов
You can set format associations in VSCode, so .erb files would be treated like .html.
您可以在 VSCode 中设置格式关联，因此 .erb 文件将被视为 .html。
Go to File->Preferences->Settings->Click ... in top right corner->Open settings.json
转到文件->首选项->设置->单击右上角的...->打开settings.json
Then add this piece of code to your settings.json
然后将这段代码添加到您的 settings.json 中
"files.associations": {
"*.html.erb": "html"
}
This is how I solved this problem. It will remove some of the code highlights but will autoformat HTML templates like an HTML document.
这就是我解决这个问题的方法。它将删除一些代码突出显示，但会像 HTML 文档一样自动格式化 HTML 模板。
回答by Andrew Koster
You're going to need all of these settings in VS Code's settings.jsonfile:
您将需要 VS Codesettings.json文件中的所有这些设置：
"ruby.rubocop.onSave": true,
"editor.formatOnSaveTimeout": 5000,
"editor.formatOnSave": true,
"files.associations": {
"*.erb": "erb"
},
Save the settings file. Install the "ruby-rubocop" and "ERB Formatter/Beautify" extensions on VS Code. Follow the documentation on both of those extensions to install their gemdependencies. Restart VS Code.
保存设置文件。在 VS Code 上安装“ruby-rubocop”和“ERB Formatter/Beautify”扩展。按照这两个扩展的文档安装它们的gem依赖项。重新启动 VS 代码。
Format-on-save functionality will only trigger if the file is actually saved (which only happens if you change the file). Saving a file that has no changes will not trigger format-on-save.
保存时格式化功能仅在实际保存文件时才会触发（只有在更改文件时才会发生）。保存没有更改的文件不会触发格式保存。
回答by Renaud Chaput
You can use Rufoto format your Ruby code. It is an opinionated formatter (like Prettieris for JS, if you are familiar with it).
您可以使用Rufo来格式化您的 Ruby 代码。它是一个自以为是的格式化程序（就像Prettier用于 JS，如果您熟悉它）。
You can use the vscode-rufoextension to integrate it with VSCode.
您可以使用vscode-rufo扩展将其与 VSCode 集成。
回答by TorvaldsDB
I use the rubocopinstead of rufo.
我使用rubocop代替rufo。
At the beginning, I used rufo. However, I met the issue
一开始，我使用rufo. 但是，我遇到了这个问题
{
boo: {
a: 1,
b: 2,
c: 3
}
}
it always format it for me as
它总是为我格式化
{
boo: {
a: 1,
b: 2,
c: 3,
},
}
add two ,, behind c: 3and boo: {}. It is that makes my rubocopfail always.
,在c: 3和后面加上两个boo: {}。正是这让我rubocop总是失败。
As for, I use the rubocopin the project. Why not use it format my codes directly!
至于，我rubocop在项目中使用了。为什么不直接使用它格式化我的代码！
If you are interested, you can do as the following:
如果您有兴趣，可以按照以下步骤操作：
install the plugin VSCode rubyand then add the following snippets in the the settings.json
安装插件VSCode ruby，然后在settings.json
"ruby.format": "rubocop",
"ruby.intellisense": "rubyLocate",
"ruby.useBundler": true,
"ruby.lint": {
"rubocop": {
"useBundler": true
}
},
save it. It works~~(I wish you)
保存。它有效~~（祝你）
回答by Bhagwan Rajput
gem install htmlbeautifier
through the search functionality provided in the editor with Ctrl +Shift+ P (or Command + Shift + P on Mac), and then searching for format document.
通过编辑器中提供的搜索功能，使用 Ctrl + Shift+ P（或 Mac 上的 Command + Shift + P），然后搜索格式文档。
回答by localhostdotdev
Nowadays (March 2019) I think prettier with prettier-ruby are the best options: it can handle Ruby, ERB (as HTML), JS, and many many more.
现在（2019 年 3 月）我认为 prettier 和 prettier-ruby 是最好的选择：它可以处理 Ruby、ERB（作为 HTML）、JS 等等。
prettier script.rb # will show you the formatted script
prettier --write script.rb # will overwrite the file with the formatted script
You can use the Prettier VS Code plugin to do that automatically: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
您可以使用 Prettier VS Code 插件自动执行此操作：https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
回答by konyak
To format your ruby files, you don't need any extra plugin, you can just map some keys to do "editor.action.reindentLines"
要格式化您的 ruby 文件，您不需要任何额外的插件，您只需映射一些键即可执行“editor.action.reindentLines”
If you use vscode-vim plugin, you can add this to your settings:
如果您使用 vscode-vim 插件，您可以将其添加到您的设置中：
"vim.normalModeKeyBindingsNonRecursive": [
{
"before": ["=", "="],
"commands": ["editor.action.reindentlines"]
}
],
Then in normal vim mode, ==will reformat your file.
然后在正常的 vim 模式下，==将重新格式化您的文件。
