前端开发神器 VSCode 使用总结
VSCode 是微软出品的,基于 Electron 和 TypeScript 的,集成了 git 版本管理和命令行终端,而且开源稳定,插件丰富,再搭配一款 Chrome 浏览器,可以说是
前端开发神器了。
安装指南
VSCode 需要用到 node.js 和 git,如果没有就到https://nodejs.org/en/download/下载 node.js,然后到https://git-scm.com/downloads下载并安装 git,注意自己的系统版本,最后到https://code.visualstudio.com下载 vscode 并安装好。
推荐插件
project manager // 项目管理
prettier // 自动格式化你的代码
gitlens // 查看 git 修改记录
bracket pair colorizer2 // 彩色括号匹配
code spell checker // 单词拼写检查
eslint // javascript 代码风格检查工具
git history // git 历史
npm intellisense // npm 自动补全
path intellisense // 自动补全文件路径
material icon theme // 好看的图标
highlight matching tag // 高亮匹配标签
better toml // toml 文件支持
auto rename tag // 自动重命名标签
auto close tag // 自动关闭标签
debugger for chrome // 在 chrome 里调试
visual studio intellicode // 智能补全
Markdown All in One // 写 markdown 神器
ES7 React/Redux/GraphQL/React-Native snippets // react 代码简写
react native tools // 写 react native
vetur // 写 vue
javascript(es6) code snippets // javascript 代码简写
推荐快捷键
F1 打开可以输入命令
F2 重命名变量,方便重构
F5 运行和调试代码
F12 去到定义的地方
shift+F12 查找所有引用
ctrl+g 会让你输入数字,快速定位到指定行
ctrl+enter 在下方另起一行
crtl+f 查找
ctrl+shift+n 多开一个 vscode 编辑器
ctrl+b 开关侧边栏
ctrl+h 替换
ctrl+r 打开最近文件
ctrl+` 终端
ctrl+tab 切换文件
ctrl+shift+e 切到资源管理器
ctrl+p 快速打开文件
ctrl+[ 左移代码
ctrl+] 右移代码
ctrl+/ 行注释
ctrl+t 匹配文本来打开文件
ctrl+shift+t 重新打开关闭的文件
ctrl+shift+home/end 选择光标左侧/右侧全部内容
ctrl+backspace 删除上一个词
ctrl+delete 删除光标右侧的词
ctrl+左/右 跳到上/下一个词
ctrl+shift+左/右 逐个选词
鼠标滚轮或者shift+alt+鼠标拖拽 批量选中,方块选择
ctrl+shift+pageup/pagedown 切换文件
ctrl+d 选中当前词语
ctrl+enter 下方插入一行
alt+左/右箭头 跳回来/过去
alt+shift+上/下箭头 向上/下复制行
前端开发神器 VSCode 使用总结的更多相关文章
- webstorm+nodejs+JetBrains IDE Support+chrome打造前端开发神器
#webstorm+nodejs+JetBrains IDE Support+chrome打造前端开发神器 -- 工欲善其事 必先利其器 ##各工具介绍 `webstorm`是**JetBrains* ...
- Web前端开发神器--WebStorm(JavaScript 开发工具) 8.0.3 中文汉化破解版
WebStorm(JavaScript 开发工具) 8.0.3 中文汉化破解版 http://www.jb51.net/softs/171905.html WebStorm 是jetbrains公司旗 ...
- 前端开发工具-VsCode插件【个人开发常用】
前端开发工具-VsCode插件[个人开发常用] Atom One Dark Theme-主题 Chinese (Simplified) Language Pack for Visual Studio ...
- 前端开发神器Charles从入门到卸载
前言 本文将带大家学习使用前端开发神器-charles,从基本的下载安装到常见配置使用,为大家一一讲解. 一.花式夸奖Charles 截取 Http 和 Https 网络封包. 支持重发网络请求,方便 ...
- Sublime Text 使用指南 - 前端开发神器
Sublime Text 前端开发的神器 Sublime Text是一个前端开发者必备的编辑器,大量的插件,完善的功能,优越的性能,有非常多的特色,给前端开发提供了一个完善的开发条件. 本文主要介绍的 ...
- 前端开发神器 - Brackets
做了几年的 .Net 项目开发,后来公司转 Java 语言开发,Java 做了还没一年,公司准备前后端分离开发,而我被分到前端! Brackets是一款基于web(html+css+js)开发的web ...
- 前端开发利器VSCode
最近找到一款非常好用的开发利器,VSCode.一直认为微软做的东西都很一般,这个软件让我刮目相看了. 之前使用webstorm卡的不行,换了这个非常好用. 用着还不错,这里记录下一些使用的心得. VS ...
- 前端开发IDE VSCode + live preview
live preview 为方便web开发者,编写网页静态代码,不用频繁切换到浏览器去查看的贴心功能. 可以在编辑器中,就实现编辑预览功能, 边编写代码,边查看预览效果. 与vscode相对应的其他两 ...
- 前端开发神器Sublime Text2/3之安装使用(windows7/Mac)
一,到官方网站下载神器 地址:http://www.sublimetext.com/3 Sublime Text 3 配置解释(默认){// 设置主题文件“color_scheme”: “Packag ...
随机推荐
- HTML:一张思维导图搞懂HTML
HTML常用标签及其用法
- List容器排序方法的使用
今天在做任务的时候需要对已经存到list容器里的对象数组进行排序,需要根据 其中的一个属性进行排序,最初是根据一个利用冒泡排序的算法进行处理的后来上网查了一下对于list容器进行排序时有自带的方法.所 ...
- ROS之服务
服务(service)是另一种在节点之间传递数据的方法,服务其实就是同步的跨进程函数调用,它能够让一个节点调用运行在另一个节点中的函数. 我们就像之前消息类型一样定义这个函数的输入/输出.服务端(提供 ...
- Tarjan算法——强连通、双连通、割点、桥
Tarjan算法 概念区分 有向图 强连通:在有向图\(G\)中,如果两个顶点\(u, v\ (u \neq v)\)间有一条从\(u\)到\(v\)的有向路径,同时还有一条从\(v\)到\(u\)的 ...
- Codeforces_835
A.比较两人总时间. #include<bits/stdc++.h> using namespace std; int s,v1,v2,t1,t2; int main() { ios::s ...
- 一台电脑上配置多个git的ssh key
前几天公司的代码库全部迁移到了阿里云上,在配置git的ssh key的时候遇到了一个问题,那就是自己的密钥在添加时提示已经存在,原来是自己的个人账号上已经添加过这个密钥了,公司分配的账号就不能再添加这 ...
- java代码之美(15)---Java8 Function、Consumer、Supplier
Java8 Function.Consumer.Supplier 有关JDK8新特性之前写了三篇博客: 1.java代码之美(1)---Java8 Lambda 2.java代码之美(2)---Jav ...
- Nginx 部署及配置
Tengine + Luajit2 系统账号及环境配置 $ sudo useradd -g 100 -u 200 user_00 $ sudo groupadd -g 300 www $ sudo u ...
- 腾讯云Centos服务器部署问题
在Centos7上部署Tomcat过程 下载并安装JDK 下载并部署Tomcat 打开Centos中对应的端口(默认80) 这几步操作很清楚,但首次使用Centos7时遇到了一个问题,外网无法访问服务 ...
- [redis读书笔记] 第三部分 多机数据库的实现 复制
另外一篇写的很好很深入的文章:http://www.tuicool.com/articles/fAnYFb : RDB持久化 http://www.tuicool.com/articles/F3Eri ...