VisualStudioCode

どこでも同じ設定でVisualStudioCodeを使う方法

はじめに

VisualStudioCodeを使い始めて3ヶ月ほどなのですが、統合ターミナルとかプラグインでの機能追加とか、便利ですよね。
これまでvimを使ってきたんですが、VisualStudioCodeに乗り換えようかなと思い、色々と自分なりに設定を試してみたりしています。
でも、職場の端末で見つけた設定を、家の端末にも反映しないといけないのは面倒くさい。
ということで、どこでも同じ設定を使えるようにしてみました。

想定読者

次の全てに当てはまる人を対象にしています。

  • 複数の端末でVisualStudioCodeを使ってる方。
  • 全部の端末で同じ設定を使いたいなという方。

概要

どこでも同じ設定で使えるようにするためには、settings.json を共有できるようにしましょう。
この記事ではGitHubを使った共有方法を紹介します。

※ 共有するための拡張機能として Settings Sync もあるようなので、こちらを使う方がお手軽かもしれません。 (@BEACHSIDEさんに教えていただきました。)

どうすればいいの?

VisualStudioCodeの設定は settings.json に書き込まれます。なので、このファイルを複数環境で共有してしまえば、どこでも同じ設定で使えるようになります。
公式ドキュメントによると、次の場所に配置されるようです。

  • Windows %APPDATA%\Code\User\settings.json
  • Mac $HOME/Library/Application Support/Code/User/settings.json
  • Linux $HOME/.config/Code/User/settings.json

共有方法はなんでもOKです。共有フォルダに置くとかDropbox使うとか。でも次の利点があるのでGitHubなどのGitホスティングサービスを使うのがオススメです。

  • 設定のバージョン管理ができる。
  • WindowsとMacなど異なるOSの端末間で設定を共有するときに、settings.jsonの文字コードの違いをGitが吸収してくれる。(文字コードが違うと問題が起きるかは確認してませんが。)

本記事では、GitHubを使う方法を紹介します。

GitHubを使った共有方法

今回はGitHubを介してsettings.jsonを各環境で共有します。
手順は次の通り。

  1. 設定を管理するリポジトリを作成。
  2. リポジトリ内にvscodeディレクトリを作成。その中にsettings.jsonを配置してコミット・プッシュ。
  3. VisualStudioCodeが参照する場所に、vscodeディレクトリへのシンボリックリンクを作成(コマンドは次の通り)。
    • Windows mklink /d %AppData%\Code\User {vscodeディレクトリの場所}
    • Mac ln -fnsv {vscodeディレクトリの場所} $HOME/Library/Application Support/Code/User
    • Linux ln -fnsv {vscodeディレクトリの場所} $HOME/.config/Code/User

設定を変更した時はsettings.jsonへの変更をコミット・プッシュしましょう。その後、他端末でプルすれば変更の反映完了です。

シンボリックリンクを作成するのは、自分の好きな場所にgitのローカルリポジトリを配置したかったからです。シンボリックリンクを作成するスクリプトもsettings.jsonと一緒に管理しておくと、新しい環境を使い始めたときの初期設定が楽になると思います。

実際に私が使っている設定は次のリポジトリで公開してますので、参考にしてみてください。
(vimとかGitの設定も共有できるようにしてるためごちゃごちゃしてますが、基本は上記の通りです。)
https://github.com/canpok1/dotfiles

まとめ

settings.jsonをGitHubで管理することで、どこでも同じ設定でVisualStudioCodeを使えるようになりました。
次はインストールするプラグインとかも共有できたらなと思ってます。
もっといい方法などあれば、教えていただけると幸いです。