Atom から Visual Studio Code に移行してみた

Atom を使っているとたまに重くなることありませんか？ 開発環境で Atom Helper が CPU 100% になる現象が頻発していたので、重い腰を上げて Visual Studio Code を入れてみました。

Visual Studio Code をインストール

まずは公式サイトからダウンロードしてきます。

Visual Studio Code - Visual Studio

基本設定をいじる

[基本設定]-[設定] 画面から、拡張 JSON 形式で設定を記述します。Sublime Text みたいですね。

とりあえず最初は以下の設定を行いました。

// 保存時にフォーマットを行うかどうか
"editor.formatOnSave": true,

// タブサイズを半角スペース2桁に
"editor.tabSize": 2,

拡張機能をインストールする

Atom では主に Ruby/JavaScript/HTML/CSS を書いていたので、この辺りのコーディングに必要な拡張機能を入れてみました。

• Beautify
  • 各種コードのフォーマットに
• ESLint
  • ESLint の実行
• PostCSS syntax
  • PostCSS のシンタックス表示に
• Prettier
  • JavaScript のコードフォーマットに
• Ruby
  • Ruby の Lint、フォーマット、デバッグ etc
• ruby-rubocop
  • Rubocop の実行に
• Vetur
  • Vue.js の .vue コンポーネントのシンタックス表示に

なぜか手元ではファイル保存時に Rubocop が走ってくれないのですが、それ以外はほぼ Atom に近い状況になりました。

Settings Sync を導入して設定を共有する

別の環境にも VS Code を入れる場合にイチから設定するのも面倒なので、基本設定や拡張機能を共有できる Settings Sync を導入しました。

marketplace.visualstudio.com

設定内容は Secret Gist を経由して共有されます。この共有の仕方は面白いですね。

今後は Atom で使っていた細かい便利プラグインの代替を探してみたいと思います。