一、常用插件
1.React Native Tools
支持CLI命令和调试信息等。
2.vscode-icons-mac （另外一个：Material Icon Theme）
设置文件导航图标
3.ES7 React/Redux/GraphQL/React-Native snippets
用于支持ReactNative语法
4.Dracula Official
常用的主题
5.Indent-Rainbow
代码
6.Color Highlight
颜色高亮
7.Path Intellisense
在 VS Code 中支持自动补全文件路径名的插件
8.Project Manager
快速切换项目
8.1 调出命令面板，输入：>Project Manager:Edit Projects
8.2 然后可以快速找到项目
9.代码格式化
Prettier - JavaScript formatter （快捷键：Alt + Shift + F）
10.自动补全 HTML/XML 关闭标签
Auto Close Tag
提高开发效率的插件，在 VS Code 中支持自动补全 HTML/XML 关闭标签。
11.重命名 HTML/XML 对应标签
Auto Rename Tag
提高开发效率的插件，在 VS Code 中支持重命名 HTML/XML 对应标签。
12.括号上色
Rainbow Brackets
在 React Native 开发中经常会存在多种括号混合使用，为了能够更好的区分，这个插件支持不同类型的括号进行彩色着色，支持圆括号，方括号和花括号。
13.AutoFileName
自动补全文件名的插件
14.Visual Studio IntelliCode - Preview
Command + 鼠标左键进入代码内
15.Local History
查看文件历史。
16.Flow Language Support
格式化代码
17.VSCode打开多个项目窗口的方法
下载插件：Project Manager
{
"name": "mobileApp_android",
"rootPath": "/Users/luolin/Public/Project/RNProject/mobileApp_android",
"paths": [],
"group": "",
"enabled": true
},
18.VSCode 使用Eclipse 快捷键
Eclipse Keymap
19.运行JS插件
Run Code
20.补全文件路径
Path Intellisense
21.代码颜色显示
Bracket Pair Colorizer
22.颜色高亮 Color HighLight
23.快速运行HTML代码 “live server” --> 在代码界面单击右键 --> 选择 Open with Live Server
说明：该插件是在学习Vue学习的，目前发现在VSCode 中快速运行，并且还热更新。
二、离线安装插件
1.进入插件市场
2.下载相应的插件 后缀为 .vsix。
3.将下载的vsix 文件拷贝在指定的路径，然后cd到指定的路径执行命令安装插件。
code --install-extension dracula-theme.theme-dracula-2.22.1.vsix
4.执行完第三步后会显示如下信息。
Extension ‘dracula-theme.theme-dracula-2.22.1.vsix’ was successfully installed!
三、其它
1.Vue 安装的插件：
"Vetur" --- Vue 语法使用插件
"Live Server" --- 用户快速运行vue，并且热加载
2.在setting.json中设置如下，主要用于保存代码后自动格式化，并且 html标签、style样式、css属性及值
"editor.formatOnType": true, //自动格式化
"editor.formatOnSave": true,
"editor.suggest.snippetsPreventQuickSuggestions": false,
"files.associations": {
"*.vue": "html"
}
3.使用 “ $ code . ” 打开项目
3.1 安装code：打开VSCode –> command+shift+p –> 输入shell command –> 点击提示Shell Command: Install ‘code’ command in PATH运行。
3.2 使用：打开终端，cd到要用VSCode打开的文件夹，然后输入命令code .即可打开
网友评论