Visual Studio Codeの設定を複数の端末間で同期する「Settings Sync」機能の使い方

Visual Studio CodeのVer.1.48以降は公式の設定同期機能の「Settings Sync」があり、Visual Studio Codeの設定を複数端末間で同期できるようになりました。
設定のほとんどが同期されます。
今回はそんなSettings Syncの設定方法についてまとめておきます。
Settings Sync
Settings Syncは「GitHubアカウント」もしくは「Microsoftアカウント」と紐付けてVisual Studio Codeの設定を同期するVisual Studio Code公式の機能です。
同期できる設定は下記の通りで、ほとんどのVisual Studio Codeの設定項目が同期できます。
- Visual Studio Codeの設定
- キーボードショートカット
- ユーザースニペット
- ユーザータスク
- 拡張機能
- UIの状態
拡張機能は不要
公式の「Settings Sync」機能ができる前は、「Setting Sync(名前が紛らわしいですが、こちらは単数形)」という拡張機能がありました。
これでも設定の同期はありますが初期設定がややこしく、現在は公式機能があるのでそっちに頼るようにしましょう。
同期の設定方法
設定するには、Visual Studio Code左下の「アカウント」アイコンをクリックして[サインインして設定を同期する]を選択します。
![[サインインして設定を同期する]](https://webrandum.net/mskz/wp-content/uploads/2022/08/image_1-7.png)
すると「設定の同期」パネルが表示されて「Microsoft でサインイン」と「GitHub でサインイン」のどちらにするか選択します。

選択すると、ブラウザでMicrosoftかGitHubの連携用のページを開くためのモーダルが表示されます。
「開く」を押してブラウザを表示させましょう。

GitHubのログインページが表示されるので、連携したいアカウントでログインします。

ログインすると、「Visual Studio Code.app を開きますか?」ダイアログが表示されるので「Visual Studio Code.app を開く」をクリックします。

Visual Studio Codeに戻るので、最後に「開く」ボタンをクリックすると設定の同期が完了します。



Visual Studio Codeで英単語のスペルチェックをしてくれる拡張機能「Code Spell Checker」
HTMLが書ければすぐ習得できるテンプレートエンジン「EJS」の基本的な書き方
Visual Studio Codeで複数ファイルを編集するときにタブやペインの操作方法
スクロール時に表示領域に画面がくっつくようになる処理をCSSだけで実現する「scroll-snap」
WordPressでbloginfo()の一部パラメーターの廃止・非推奨に注意!
CSSやJavaScriptでスクロールバーの横幅を取得する方法
JavaScriptのforEach内で「continue」や「break」のような動作をさせる方法
Visual Studio CodeでCSVの編集を見やすく行う拡張機能「Edit csv」
WordPressで作成した記事をSlackでシェアしたときに、抜粋文が長く表示される場合の対処法
既存プロジェクトにCompassが導入されている場合に備えて、最低限Sassのコンパイルだけでも行えるようにしておく
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
ウェブのGoogle Drive上でコピーアンドペーストのショートカットキーが使えるように!
「EWWW Image Optimizer」を使ってWordPressをWebPに対応する方法
Path Finderの情報パネルにある「作成日」「更新日」「追加日」の違い
Macでfnキーを2回押すと音声入力が起動するのを無効化する方法
新しいMacBook Proを購入して移行するときにやること|最低限のアプリ設定編
Keyboard Maestroのバージョン9.0がリリース!ダークモード対応やJSON関連のアクションが追加
Keyboard MaestroのThird Party Plug Insの作り方
MagicPrefsを使ってMagic Mouseのカスタマイズを行う
Nuxt.jsでaxios-moduleを使ってAPIからデータを取得・表示する|Nuxt.jsの基本
画面共有しながら説明するときに画面上に図形が描ける「Presentify」