53
51

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Visual Studio Codeで設定ファイル・キーバインディング・拡張機能を共有する

Last updated at Posted at 2017-08-02

VS Code 1.44.0のインサイダーで、公式のSeeings Sync機能がリリースされます。
Microsoftアカウントで同期する形のようなので、この記事の対応は不要になります。


長年使っていたVimからVisual Studio Codeに乗り換えました。
拡張機能も入れるの簡単ですし、そもそも最初の設定だけでそれなりに使えていいエディタだと思っています。
自分はデスクトップ・ラップトップを持ち替えて使うことが多く、個別にセットアップしていたら色々と差分が出てきてしまったので設定ファイルの共有方法を考えていました。

Vim, Emacsを使っている人ならdotfilesリポジトリを使って管理しているような雰囲気を感じますが、Visual Studioでは基本GUIで設定を行えてしまいます。
開発環境のポータビリティを考えてシェルの設定と含めてVSCodeの設定を含んだdotfilesをGithubで管理したいというモチベーションで考えています。

設定ファイルの共有

VSCodeの設定ファイルはmacOSだと ~/Library/Application\ Support/Code/User/ 以下のsettings.json, keybindings.jsonに保存されています。

単純に共有したいディレクトリ上とシンボリックリンクを貼れば問題ないと思います。
以下はmacOSでの実行例です。

macOSでの実行例
# = 現在の設定があるPCでの操作
# 共有用フォルダ(今回の例では~/dotfiles/vscode)に今の設定ファイルを置く

mkdir -p ~/dotfiles/ ~/dotfiles/vscode
cd ~/Library/Application\ Support/Code/User/
mv ./settings.json ~/dotfiles/vscode/settings.json
mv ./keybindings.json ~/dotfiles/vscode/keybindings.json
ln -s ~/dotfiles/vscode/settings.json ./settings.json
ln -s ~/dotfiles/vscode/keybindings.json ./keybindings.json

# = 新しいPCでの操作
# 共有用フォルダにあるファイルからシンボリックリンクを貼る

cd ~/Library/Application\ Support/Code/User/
rm settings.json
ln -s ~/dotfiles/vscode/settings.json ./settings.json
rm keybindings.json
ln -s ~/dotfiles/vscode/keybindings.json ./keybindings.json

自分はdotfilesをGithubで管理する前提で~/dotfilesディレクトリを使っていますが、Dropbox上で同期する方法も考えられます。

Windowsだとlnではなくてmklinkでシンボリックリンクを作れるらしいですが、動作確認する環境がないので今回は対象外。

拡張機能の共有

拡張機能はファイルで管理しているわけではありません。(そういう認識でいます)
Command Lineツールで拡張機能一覧をの取得や新規拡張機能のインストールが出来るのでCommand Lineツールを利用して共有していきます。

(mac OSのみ必要) Command Lineツールをインストールする

WindowsとLinuxでは code コマンドがインストール時に使えるようになっていますが、mac OSでは自分でインストールする必要があります。

macだとCommand Palatte(Shift + Command + P) を開きShell Commandと検索して Shell Command: Install 'code' command in PATH command. を選択します。

これでTerminal上でcodeコマンドが利用可能になります。

参考
https://code.visualstudio.com/docs/setup/mac

拡張機能一覧を出力する

設定ファイルには拡張機能の情報はないので、このままではプラグインの共有が出来ません。
code-cliを使えばインストール中のプラグインを出力出来たり、特定の拡張機能をインストールすることが出来ます。

code --list-extensions で以下の様な出力が得られるので code --list-extensions > extensions で拡張機能リストのファイルを作ります。

出力例
HookyQR.beautify
PeterJausovec.vscode-docker
vscodevim.vim
...

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

1行ずつ見ていってインストールしていけばいいので以下の様なシェルスクリプトを実行すれば一覧を元に復元出来ます。
これで拡張機能の共有が可能になります。

install_extensions.sh
#!/bin/sh

cat ./extensions | while read line
do
  code --install-extension $line
done

先程保存したextensionsファイルがあるディレクトリでsh install_extensions.shを入力するといい感じにインストールしてくます。

スクリーンショット 2017-08-02 4.07.17.png

もっといい方法知りたい

拡張機能の復元方法が強引な感じがしますが、しょうがないかなという印象です。
そのうち本体に管理機能ができそうな気がするので今はこの方法でごまかしていきたいと思います。

開発環境のポータビリティを上げて旅しながら仕事みたいなことしてみたいですね

自分のdotfiles
https://github.com/mottox2/dotfiles/tree/master/vscode

53
51
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
53
51

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?