VSCodeでRails開発

# VSCodeでRails開発

VSCodeで、主にRuby（Railsアプリ）を書く際のストレスを解消するために作った拡張機能を紹介します。

## Rails専用

### [Rails Routes](https://marketplace.visualstudio.com/items?itemName=aki77.rails-routes)
`config/routes.rb`の内容に応じて、URLヘルパの入力補完とジャンプが可能になります。
入力補完が効かない箇所でも、`railsRoutes.insert`コマンドによる入力が可能です。

![definition](https://i.gyazo.com/8ce05c897a84ab2b8d6b4d8e98e6858f.gif)

### [Rails Partial](https://marketplace.visualstudio.com/items?itemName=aki77.rails-partial)
パーシャルファイルの入力補完、ジャンプ、作成が可能になります。

![Definition](https://i.gyazo.com/91cea6f3b630a430387911d684562df6.gif)

### [Quick Open Rails](https://marketplace.visualstudio.com/items?itemName=aki77.quick-open-rails)
Railsアプリ内の各種ファイルを種類別に簡単に開けるようになります。
似たような拡張機能はいくつかあったのですが、微妙に欲しいものと違ったので作りました。
デフォルト設定の状態で以下の特徴があります。（変更可能）

- appディレクトリ以下は自動的にサブディレクトリ名でカテゴライズされる
- マイグレーションファイルは新しい順に表示

![open](https://i.gyazo.com/5c7ed75d5bd703d4cce7601fcf87e113.gif)


### [Rails DB Schema](https://marketplace.visualstudio.com/items?itemName=aki77.rails-db-schema)
`db/schema.rb`の内容に応じて補完やジャンプが可能になります。
補完が効かない箇所でも`railsDbSchema.insert`コマンドによる入力が可能です。

![Completion](https://i.gyazo.com/b096d87941300203e0d09f854862f9d8.gif)

### [Rails I18n](https://marketplace.visualstudio.com/items?itemName=aki77.rails-i18n)
入力補完やマウスホバーでの翻訳表示が可能となります。
類似パッケージとの違いとしては以下になります。

- 補完対象のメソッドを設定可能
- I18n.lメソッドの補完がいい感じに表示される（当社比）
- ~~localesファイルへのジャンプは未サポート~~
  - v0.3.0で対応済み
  - v0.5.0で追加した`railsI18n.gotoTranslation`コマンドを実行すると、QuickPickに表示された翻訳一覧からジャンプ可能
- 対象ファイルに応じたprefixが補完候補に優先表示される
  - 例: app/views/home/show.html.hamlの場合は`views.home.show`
- 相対キーから絶対キーにQick Fixで修正可能

![translate](https://i.gyazo.com/f05479cbeeae524235096223e7636164.gif)

### [Haml Lint](https://marketplace.visualstudio.com/items?itemName=aki77.haml-lint)
VSCodeからhaml-lintを利用できます。
一部quick-fixにも対応しています。

### [Rails Extension Pack](https://marketplace.visualstudio.com/items?itemName=aki77.rails-extension-pack)
自作以外のパッケージも含めたRails向け拡張パックです。

### [Rubocop Quick Fix](https://marketplace.visualstudio.com/items?itemName=aki77.rubocop-quick-fix)

Quick Fix機能でrubocopの警告を簡単に無効化できます。
Solargraph拡張以外でrubocopの警告を表示している場合は多分動作しません。（未確認）

![feature](https://i.gyazo.com/a7eb652d40a4412056b5636ee5718d16.gif)

### [Rails ViewComponent](https://marketplace.visualstudio.com/items?itemName=aki77.rails-view-component)

renderでの補完候補に[ViewComponent](https://viewcomponent.org/)が表示されます。
引数も表示されるのでコンポーネントが対応している引数を覚えておく必要が無くなります。

![feature](https://i.gyazo.com/93d985f388d4e39b84022a99f70800e1.gif)

### [HTML ERB](https://marketplace.visualstudio.com/items?itemName=aki77.html-erb)

`.html.erb`ファイル内で、HTMLコードを編集する場合にvscode標準のhtml-languageserviceの機能が使えるようになります。
Rubyコード内ではruby用の機能が使えます。

![feature](https://i.gyazo.com/be7b36b7c70104e3ac48e5d1506db64c.gif)

## Rails以外でも使える拡張

### [Autocomplete Symbols](https://marketplace.visualstudio.com/items?itemName=aki77.autocomplete-symbols)
ワークスペース内のシンボルによる入力補完が可能となります。
デフォルトでは4文字以上入力した場合にその他補完候補が存在しない場合のみ表示されるようになっていますが、任意のキーで呼び出すことも可能です。
何となくしか名前を覚えていないメソッドを呼びたい場合に重宝します。
シンボルの解析についてはruby拡張のrubyLocate設定を有効にしています。（`vendor/bundle`以下にGemをインストールしておけばGemのメソッドも補完できます）

![demo](https://i.gyazo.com/00686ea818174759942737138d345c6a.gif)

### [Snippets by pattern](https://marketplace.visualstudio.com/items?itemName=aki77.snippets-by-pattern)
ファイル名のパターン別にスニペットを管理できます。
例えば同じruby用のスニペットでもコントローラー、モデル、マイグレーション、rspecそれぞれ別々に管理することで入力補完時のノイズを減らせます。
また既存のコードを簡単にスニペット化するためのコマンドも付いています。

詳しい説明は [VSCodeのスニペット機能をより便利にする方法](https://qiita.com/aki77/items/dc0287605ffc43bc9114) をどうぞ。

![alt](https://i.gyazo.com/bbca63de32735c70c6a4b3c9a103b9a0.gif)

### [Quick Open Git Status](https://marketplace.visualstudio.com/items?itemName=aki77.quick-open-git-status)

差分の発生しているファイルから絞り込んで簡単に開けるようになります。
Atomでは標準機能で用意されていたのですが、VSCodeでは存在しないようだったので作ってみました。

![feature](https://i.gyazo.com/2caaabfa6980757cd9888ae3946e4993.png)

### [Symbol Definition](https://marketplace.visualstudio.com/items?itemName=aki77.symbol-definition)

ワークスペースのシンボル情報を元にコードジャンプ可能となります。
主にhamlファイルからのコードジャンプの為に作りました。

![Demo](https://i.gyazo.com/7a161636a68768c022774287424e555c.gif)