A. 如何添加扩展程序到chrome
第一种方法;直接本地安装
1. 下载扩展程序/脚本程序，将其保存在本地计算机内;
2. 将保存下来的 *.crx 文件或 *.js 文件直接拖拽到浏览器的扩展程序( chrome://chrome/extensions/)页面。 ( 注:只有拖动到此页面才能安装，其它页面无效)
3. 按照提示安装
安装第二种办法，开发模式安装
1， 也是先将扩展程序下载保存到本地，然后将下载来的文件后缀名 *.crx 改成 *.rar，这样你就得到了一个压缩文件，然后右键解压这个压缩文件得到一个文件夹。
2然后在浏览器里打开扩展程序页面( chrome://settings/extensions)，选中右上方开发人员模式复选框，然后再点击左上方的载入正在开发的扩展程序按钮，选中刚刚解压出来的文件夹然后点确定即可。
3. 开启浏览器支持 右击 Chrome 桌面快捷方式，选择-属性-快捷方式，然后在目标一栏尾部添加参数 --enable-easy-off-store-extension-install ，然后再运行浏览器就可以像以前那样正常安装 Web Store 之外的第三方扩展应用及脚本程序了。 (注意破折号前的空格 )
B. 适合前端开发人员的vscode扩展插件有哪些
1，HTML snippets(Visual Studio Code HTML snippets)
这是一款前端开发者必备的扩展，它能将你从手动键入每个标签中解放出来。只需输入 div 然后按下回车，一对标签就出现了。更厉害的是，对于需要嵌套的标签，你可以直接用 ul>li>a 的格式表示，按下回车后就能看到你需要的嵌套。还有一点，这个扩展已经包括所有的 HMTL5 片段。
2，JavaScript (ES6) code snippets
几乎每个前端程序员都是 JavaScript 的使用者，为了提高编写 JS 代码的效率，这个扩展很有用，并且它还支持 .ts, .tsx 和 .jsx 文件。
扩展中有很多快捷缩写，比如想要调用 export default class ClassName{}，输入 ecl 按下空格即可。
3，CSS Peek
既然已经分别介绍了 HTML 和 JS 的助手，我们也不能落下 CSS。CSS Peek 是一个支持 .html 和 .js 文件的扩展，它能帮助开发者快速找到和查看选定类或 id 所用的样式。对于那些不喜欢来回切换文件或者分屏的开发者来说这个扩展很有用。
4，Angular/React/Vue
既然提到了代码片段，我们最好也提一下每个框架下的不同扩展。
对 AngularJS 来说，Angular Snippets(Version 8)是针对 AngularJS 8 的一款扩展，它为我们提供 Typescript 和 HTML 的代码片段。
对于 React.js 框架，ES7 React/Rex/GraphQL/React-Native snippets 是一个优秀的扩展，它使用 ES7 提供 React 和 Rex 的代码片段，用法和 Javascript snippets 类似，都是按空格键。
对 Vue.js 开发，有一个叫 Vetur 的扩展相当棒，它目前的下载量已经有将近2,000万。Vetur 的功能很强大，包括代码片段，Emmet，错误检查，格式化，调试和高亮语法等。
5，ESLint
如果你想要写出友好，易读，干净的代码，我建议你在 VSC 中安装一个 ESLint 扩展，它会帮助你持续养成好的编码习惯，比如缩进等。
6，Prettier 代码格式工具
说到漂亮整洁的代码，Prettier 听名字你就值得拥有。尤其在项目需要你和其他同事合作完成时，Prettier 会强势地将代码格式全部统一，让你再也不用和同事讨论自己的代码。
7，GitLens
VSC 是整合了 git 功能的，通过安装 GitLens 这个功能将会更强大，它能让你看到每一行代码是由谁在什么时候写的，并且快速查看代码提交详情，在团队协作中这个扩展很有用。
8，Auto import 自动导入包
Auto import 是一个自动导入包扩展。如果目前手头的项目是基于不同组件的，那么你需要做的就是给每个组件命名，剩下的事交给 Auto import 就好。
9，Path autocomplete 路径自动补全
提到了导入的问题，另一个重要的扩展就是能够智能补全导入文件路径的 Path autocomplete。使用时，输入 ./ 后你就会看到一个包含所有文件名的下拉菜单。当文件目录繁杂时，这个扩展真的是很好用，它为你省去了很多一层一层刨开目录的痛苦。
10，Bracket Pair Colorizer 括号着色器
括号着色器能让我们一眼看出当前代码块的反括号在哪里。有时候在稍微复杂的函数中，找到正确的那对代码并不是那么容易，但 Bracket Pair Colorizer 在你键入一个括号时就为这一对括号分配了自己的颜色，便于阅读。
11，Indenticator 缩进指示器
Indenticator 可以高亮显示出当前缩进的深度，深度由线和点表示，同样使代码更整洁，提高代码易读性。
12，Debugger for Chrome 调试器
放在最后的是重磅级的调试扩展 Debugger for Chrome。这个插件能让你在 VSC 里面直接调试 JS 文件，效果和 Chrome 的控制台中差不多，让你不用打开浏览器就直接打断点。 （BY三人行慕课）
C. Chrome扩展开发入门 2.怎样使用Chrome Extensions API
Google提供的Chrome Extensions API是开发Chrome扩展用到的最权威资料之一，里面详细介绍Chrome扩展所能够实现的各方面的功能和Chrome浏览器所提供的接口（比如怎么调用用户书签）。
使用步骤如下：
后台HTML里的JS在浏览器被打开时就开始执行了，当浏览器关闭时停止工作。你可以在这里写一些代码监视浏览器动作（比如在监视到用户创建了一个新标签页时邪恶的把它关闭,可以做定时任务（setInterval等），可以添加一段音乐。
用户点击扩展栏图标时可以弹出一个页面，当用户点击网页部分时这个页面就被关闭了。
可以使用js获取用户当前网页的DOM数据，监听用户键盘、鼠标动作。这些代码是一个独立的JS文件（而不是像后台、弹出窗等是一个HTML文件里的嵌入js代码），通过扩展配置注入到相应的网页。
读取用户计算机数据（NPAPI Plugins）。这个功能要用到dll（动态链接库）知识，可以启动用户电脑的程序，删除用户文件等功能。相当于一个小Windows程序。利用Chrome提供的方法可以让扩展的后台页面与你的dll通信。