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の基本|概要やインストールから日本語化など最低限の設定方法
スライドを簡単に実装できるJavaScriptライブラリ「Swiper」
gulp-plumberとgulp-notifyでgulpエラー時にデスクトップで通知がくるようにする
CSS疑似要素(::beforeや::after)のcontent内で改行したり半角スペースを複数入力する方法
SourceTreeの外部Diff / MergeツールをKaleidoscopeに設定する
1Passwordの開発者向け機能(SSH Agent / Environments / 1Password CLI / Developer Watchtower)
gulpでPostCSSを使う方法
Nuxt.jsで「Classic mode for store/ is deprecated and will be removed in Nuxt 3.」のエラーメッセージが表示される場合の対処法
iTerm2を使いこなすために覚えておきたいショートカット集
SourceTreeを開くと「’git status’ failed with code 69:’」というポップアップが出てくる場合の解決方法
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
デフォルトのままじゃもったいない!Google日本語入力での品詞の設定方法と意味まとめ
Sketchの図形周りの基本操作|図形の作成方法から描画に関する細かい部分まで
Apple Watchの余計な通知を来ないようにして快適にする方法
ATOKで変換時に文章を指摘してくれる「校正支援」タブの設定項目
mac環境にnodebrew経由でNode.jsをインストールしてバージョンを管理する方法
Ulysses編集画面の画像プレビューが小さすぎる場合の対処法
WordPressの自動バックグラウンド更新を無効にする方法とその注意点
Finderで選択したフォルダを特定のアプリケーションで開くAlfred Workflowの作り方
Local by FlywheelでWordPressのローカル開発環境構築のハードルが一気に下がる