专栏首页前端全栈开发者【小技巧】同步VSCode设置及扩展插件,换机不用愁!

【小技巧】同步VSCode设置及扩展插件,换机不用愁!

有了这个技能,换电脑,换工作等就不用愁了。 实现同步的功能主要依赖于VSCode插件“Settings Sync”。它是基于 GitHub Tokens 和 GitHub Gist 功能实现,可以一键轻松实现上传下载跨多台机器同步设置、代码片段、主题、文件图标、启动、键绑定、工作区和扩展。

配置同步

下载安装插件后,会显示插件的欢迎页面

插件的欢迎页面

“设置同步配置”页面将在代码启动时自动打开,并且需要进行两项设置

  1. GitHub Token
  2. GitHub Gist Id

如果您是首次用户,则GitHub帐户需要检索 GitHub 令牌,而 Settings Sync 将创建 Gist。

执行的配置步骤:

  1. 点击 Login with GitHub ,登录GitHub成功后即可以自动拿到 GitHub Token。
  2. 登录 GitHub 成功后你将得到成功的消息。

成功的消息

  1. 如果您是第一次使用设置同步,则在您上传设置时会自动创建 GIST。
  2. 如果您已经拥有 GitHub Gist,则将打开新窗口,以允许您选择 GitHub Gist 或跳过以创建新的 Gist。

Settings-Sync-3.png

您始终可以通过转到https://gist.github.com并检查名为 cloudSettings 的 gist 来验证创建的 gist。

也可以在这里找到Gist的入口。

cloudSettings 的 gist 就创建了,点进去查看,里面是诸如 extensions.json 等VSCode各方面的配置文件。

Settings-Sync-5.png

上传你的VSCode的配置

按下 Shift + Alt + U (macOS: Shift + Option + U),也可以使用命令来选择你的操作

Settings-Sync-6.png

首次下载或上传时,欢迎页面将自动打开,您可以在其中配置“设置同步”。选择上传设置后,你将看到“摘要”详细信息,以及上载的每个文件和扩展名的列表。

Settings-Sync-7.png

这里其实也不用记下来,它会自动配置到你的扩展配置里:

Settings-Sync-8.png

每次上传配置同步会用这个创建好的 ID。

下载你的VSCode的配置

在另一台电脑的 VSCode 中,同样先也要走安装插件、登录 GitHub 的步骤,登录成功后会列出你的所有的 Gist,点击这个配置同步的 Gist。

Settings-Sync-9.png

点击后会弹出一个提示

Settings-Sync-10.png

点击CLOSE TAB,然后 VSCode 就会开始下载你的配置信息。

慢慢等待下载完成,完成后重启 VSCode,你就可以看到新电脑上的 VSCode 插件、配置信息等全部装好了。

Settings-Sync-11.png

GitHub Gist 是什么?

扩展一下,GitHub Tokens 你应该知道是什么把,Gist又是什么呢?Gist 是 GitHub 提供的一个有趣的服务,最简单的功能就是分享代码片段,但是 gist 提供的功能不仅限于此。

开发人员常常使用 Gist 记录他们的代码片段,但是 Gist 不仅仅是为极客和码农开发的,每个人都可以用到它。如果您听说过类似 Pastebin 或者 Pastie 这样的web应用的话,那您就可以看到它们和 Gist 很像,但是 Gist 比它们要更优雅。因为这些免费应用一般含有广告,而且带有很多其他杂七杂八的功能

全文完。


本文代表个人观点,内容仅供参考。若有不恰当之处,望不吝赐教!

原文链接https://zhangbing.site/2019/11/02/同步你VSCode设置及扩展插件-换机不用愁/

作者简介:做工程不做码农(微信公众号同名),Web前端工程师,7年开发经验,坐标杭州,聚焦大前端技术和程序成的公众号,欢迎关注。我的个人微信(dunizb),欢迎添加好友进一步交流。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

相关文章

  • HTML5:给汉字加拼音?收起展开组件?让我秀给你看

    来看看 HTML 的历史和规范常识。HTML 规范是 W3C 与 WHATWG 合作共同产出的,HTML5 因此也不例外。其中:

    张张
  • GitHub中Graphs和Settings详解

    在GitHub中可以通过4种图标查看该仓库的相关统计信息。利用图标直观地汇总信息,可以让用户把握当前仓库的各种趋势。下面我们来了解一下每个图标所包含的信息。

    张张
  • 【译】3条简单的React状态管理规则

    React组件内部的状态是在渲染之间保持不变的封装数据。useState()是React钩子,负责管理功能组件内部的状态。

    张张
  • springCloud - 第3篇 - 消费者调用服务 ( RestTemplate + Ribbon )

    2. spring Initializr - module SDK 选择自己的 JDK ,其余的可以不用填写,next。

    微风-- 轻许--
  • 字节跳动教育版图:遍地撒种子

    “直到第三年,我们都没有盈利预期。”这是时任字节跳动高级副总裁、教育业务负责人的陈林在近日的一场演讲上所说。

    刘旷
  • grunt[mismatched:define]

    最近,在做项目优化,想将用到的jquery.js、bootstrap.js、angular.js、angular-ui-router.js、validator....

    奋飛
  • 斯坦福大学《机器学习》课程-中文版笔记(1)

    AI传送门
  • 微信开发本地服务器映射外网服务器步骤顺序

    1.这里推荐 http://ngrok.ciqiuwl.cn/  可以使用,ngrok官网的连接失败,据说是被墙了 2.在微信平台把相关信息填写好,暂时不提交(...

    蓓蕾心晴
  • 【腾讯内部干货分享】安卓包体压缩——分析Dalvik字节码进行减包优化

    对游戏整体的压缩却不影响场景,对图片的压缩却不影响品质。最麻烦的是对代码进行压缩,简直是让程序们熬白了头发只为包体再小个几K。

    WeTest质量开放平台团队
  • iOS开发之窥探UICollectionViewController(四) --一款功能强大的自定义瀑布流

    在上一篇博客中《iOS开发之窥探UICollectionViewController(三) --使用UICollectionView自定义瀑布流》,自定义瀑布流...

    lizelu

扫码关注云+社区

领取腾讯云代金券