编译器vsCode常用的工具
1. Chinese (Simplified) Language Pack for Visual Studio Code
适用于 VS Code 的中文（简体）语言包
安装后，在 locale.json 中添加 "locale": "zh-cn"，即可载入中文（简体）语言包。要修改 locale.json，你可以同时按下 Ctrl+Shift+P 打开命令面板，之后输入 "config" 筛选可用命令列表，最后选择配置语言命令。请参阅文档并获取更多信息。
2. Debugger for Chrome
支持的功能
- 设置断点，包括启用源映射时的源文件
- 单步，包括Chrome页面上的按钮
- “本地”窗格
- 调试动态添加的eval脚本，脚本标记和脚本
- 手表
- 安慰
3. ES5 to ES6 使用lebab将ES5 javascript转换为ES6。
用法
启动命令调色板并搜索ES5 to ES6。
这将在同一目录中创建一个临时文件（无标题），可以保存该文件以供参考。
4. Git History
- 查看和搜索git日志以及图表和详细信息。
- 查看该文件的上一个副本。
- 查看和搜索历史记录
- 查看一个或所有分支的历史记录（git log）
- 查看文件的历史记录
- 查看文件中一行的历史记录（Git Blame）。
- 查看作者的历史
- 相比：
- 比较分支
- 比较提交
- 比较提交中的文件
- 其他功能：
- Github头像
- 樱桃采摘提交
- 恢复提交
- 从提交创建分支
- 在树视图中查看提交信息（所有更改的快照）
- 合并和变革
打开文件以查看历史记录，然后按F1并选择/键入“Git：查看历史记录”，“Git：查看文件历史记录”或“Git：查看行历史记录”。
可用命令
- 查看Git历史记录（git log）（git.viewHistory）
- 查看文件历史记录（git.viewFileHistory）
- 查看行历史（git.viewLineHistory）
5. jshint
建立
扩展名jshint在当前目录和全局包位置中查找模块。您可以jshint在本地安装npm install jshint或全局安装npm install -g jshint。如果jshint模块位于其他位置，请使用该jshint.nodePath设置指定正确的路径。该jshint.packageManager 设置可用于指定您正在使用的包管理器，npm或yarn。
要检查jshint加载的位置，请JSHint: Show output在扩展开始后使用该命令在输出面板中查看扩展日志。
配置选项
jshint扩展使用jshint网站上描述的标准jshint配置选项。
可以在多个位置指定选项，主要是模仿jshint的默认行为。扩展程序按以下方式查找其配置选项，并在第一个正匹配时停止：
- 在用户或工作空间设置中指定的选项文件，如下所示：
"jshint.config" : "<file path>"。文件路径相对于工作空间的根文件夹进行解释。 - 位于当前目录或当前目录的任何父文件
jshintConfig中的package.json文件中的属性值。 - 一个
.jshintrc位于当前目录或当前目录的任何父文件。 - 一个
.jshintrc位于用户的主目录文件。 jshint.options用户或工作区设置中指定的值。默认jshint.options为空。
.jshintrc可以使用此处extends描述的属性链接文件。
排除选项
为了忽略特定文件或文件夹，可以在许多位置指定排除选项，这些选项主要模仿jshint的默认行为。扩展按以下方式查找其排除选项，并在第一个正匹配时停止：
- 在用户或工作空间设置中指定的文件，如下所示：
"jshint.excludePath" : "<file path>"。文件路径相对于工作空间的根文件夹进行解释。该文件包含指定应排除的文件的glob模式。glob模式相对于工作空间的根文件夹进行解释。 - 一个
.jshintignore位于当前目录或当前目录的任何父文件。此文件中的glob模式是相对于.jshintignore文件的位置进行解释的 。 jshint.exclude用户或工作空间设置中的属性值。该属性具有以下形式："jshint.exclude" : { "<glob pattern>" : true, "<glob pattern>" : true }。glob模式相对于工作空间的根文件夹进行解释。
使用npm minimatch模块解释glob模式。请注意，解释模式之间minimatch和.gitignore模式之间存在细微差别。大多数noteably，**/name而name不是在同一个minimatch，而他们正在考虑相等.gitignore。**/name如果要匹配子树中的名称，请始终使用。
默认情况下不排除任何文件。
禁用JSHint
为了禁用工作空间的jshint，请在工作"jshint.enable" : false区设置中指定。jshint默认启用。
6. npm
节点npm
此扩展支持运行文件中定义的npm脚本，package.json并根据中定义的依赖项验证已安装的模块package.json。
注意验证通过运行完成，npm并且在管理模块时不运行yarn。
该package.json验证报告警告，模块：
- 在package.json中定义，但未安装
- 已安装但未在package.json中定义
- 已安装但不满足package.json中定义的版本。
npm为报告的警告提供了快速修复。
7. React Native Snippet
此扩展为您提供ES6，ES7，Typescript中的Javascript和React / Redux片段以及Vs代码的 babel插件功能
这里是市场React Native，StyleSheet，ReactJS，Redux Snippet的直接链接
8. TSLint (deprecated) （坑太多，慎用）
先决条件
扩展要求在本地或全局安装tslint和typescript模块。扩展将使用最接近linted文件安装的tslint模块。要全局安装tslint和typescript，您可以运行npm install -g tslint typescript。
9. Velocity （Visual Studio Code 的Apache Velocity Textmate包的端口。）
10. Vetur （写vue必安装的）
VS代码的Vue工具，由vue-language-server提供支持。
Doc：https：//vuejs.github.io/vetur
尝试使用Veturpack！
特征
- 语法加亮
- 片段
- 蚂蚁
- Linting /错误检查
- 格式化
- 自动完成
- 调试
快速开始
11. vscode wxml （微信小程序必安装）
为 VSCode 提供 wxml 语法支持及代码片段
安装
- 打开编辑器，
Ctrl + Shift + X，搜索 weapp-wxml。 - 点击
install
使用
键入关键词，然后回车。关键词不区分大小写
12. vscode-styled-components
vscode风格组件
使用基于language-sass和language-css构建的CSS语法。 安装在VSCode内，按
|
13. ESLint
VS Code ESLint扩展
将ESLint集成到VS代码中。如果您是ESLint的新手，请查看文档。
扩展使用安装在打开的工作区文件夹中的ESLint库。如果文件夹未提供，则扩展名将查找全局安装版本。如果尚未在本地或全局安装ESLint，请npm install eslint在工作区文件夹中运行本地安装或npm install -g eslint全局安装。
在新文件夹上，您可能还需要创建.eslintrc配置文件。您可以通过使用VS Code命令Create ESLint configuration或eslint在终端中运行命令来执行此操作。如果您已全局安装ESLint（参见上文），则eslint --init在终端中运行。如果您已在本地安装ESLint，则.\node_modules\.bin\eslint --init在Windows和./node_modules/.bin/eslint --initLinux和Mac下运行。
设置选项
这个扩展有助于以下变量的设置：
-
eslint.enable：启用/禁用ESLint。默认情况下启用。 -
eslint.provideLintTask：扩展是否提供lint任务来lint整个工作区文件夹。 -
eslint.packageManager：控制用于解析ESLint库的包管理器。如果全局解析ESLint库，这只会产生影响。有效值为"npm"或"yarn"或"pnpm"。 -
eslint.options：用于配置如何使用ESLint CLI Engine API启动ESLint的选项。默认为空选项包。指向自定义.eslintrc.json文件的示例是：{ "eslint.options": { "configFile": "C:/mydirectory/.eslintrc.json" } } -
eslint.run- 运行linteronSave或者onType，默认是onType。 -
eslint.autoFixOnSave- 启用保存时自动修复。请注意，自动修复的保存仅当VS代码的files.autoSave要么是off，onFocusChange或onWindowChange。它无法使用afterDelay。 -
eslint.quiet- 忽略警告。 -
eslint.runtime- 使用此设置设置节点运行时的路径以运行ESLint。 -
eslint.nodePath- 例如，如果无法检测到已安装的ESLint包，请使用此设置/myGlobalNodePackages/node_modules。 -
eslint.validate- 一组语言标识符指定要验证的文件。有点像"eslint.validate": [ "javascript", "javascriptreact", "html" ]。如果缺少该设置，则默认为["javascript", "javascriptreact"]。您还可以控制哪些插件应该提供自动修复支持。为此，只需在validate设置中使用属性language而autoFix不是简单提供对象文字string。一个例子是："eslint.validate": [ "javascript", "javascriptreact", { "language": "html", "autoFix": true } ] -
eslint.workingDirectories- 要使用的工作目录的数组。ESLint解析eslintrc相对于工作目录的配置文件（例如）。这个新设置允许用户控制哪个工作目录用于哪些文件（另请参阅CLIEngine选项#cwd）。例：root/ client/ .eslintrc.json client.js server/ .eslintignore .eslintrc.json server.js然后使用设置：
"eslint.workingDirectories": [ "./client", "./server" ]将使用服务器目录验证服务器目录中的文件作为当前的eslint工作目录。对于客户端目录中的文件也是如此。
ESLint还在解析
.eslintignore文件时或在验证相关导入语句时（如import A from 'components/A';无法找到基URI）时考虑进程的工作目录。为了使其正常工作，eslint验证过程也需要切换进程的工作目录。由于需要谨慎处理更改进程的工作目录，因此必须明确启用它。为此，请使用下面显示的对象文字语法作为服务器目录："eslint.workingDirectories": [ "./client", // Does not change the process's working directory { "directory": "./server", "changeProcessCWD": true } ]这将验证客户端文件夹中的文件，并将进程的工作目录设置为
workspace folder服务器文件夹中的和文件，并将进程的工作目录设置为该server文件夹。这就像server在ESLint用作shell命令时切换到终端中的文件夹。如果
workingDirectories省略该设置，则eslint工作目录和进程的工作目录为workspace folder。 -
eslint.codeAction.disableRuleComment- 具有属性的对象：enable- 在快速修复菜单中显示禁用lint规则。true默认情况下。location-选择要么添加eslint-disable的评论separateLine或sameLine。separateLine是默认值。例：
{ "enable": true, "location": "sameLine" } -
eslint.codeAction.showDocumentation- 具有属性的对象：enable- 在快速修复菜单中显示打开的lint规则文档网页。true默认情况下。
命令：
此扩展将以下命令提供给Command选项板。
Create '.eslintrc.json' file：创建一个新.eslintrc.json文件。Fix all auto-fixable problems：将ESLint自动修复解决方案应用于所有可修复的问题。Disable ESLint for this Workspace：禁用此工作空间的ESLint扩展。Enable ESLint for this Workspace：为此工作空间启用ESLint扩展。
