转载:VScode 好用插件集合
---------------------
作者:JayveeWong
来源:CSDN
原文:https://blog.csdn.net/weixin_42776111/article/details/86483630
版权声明:本文为博主原创文章,转载请附上博文链接!
什么是VScode
Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义快捷键、括号匹配和颜色区分、代码片段、代码对比 Diff、GIT命令 等特性,支持插件扩展,并针对网页开发和云端应用开发做了优化。软件跨平台支持 Win、Mac 以及 Linux,运行流畅,可谓是微软的良心之作......
VSCode 下载地址:https://code.visualstudio.com/
根据调查发现,VScode 和 sublime 是前端开发者比较喜欢的 IDE 。相对与这两个软件,我更喜欢的其实是 VSCode ,本博文就记录一下比较好用的 VSCode 插件。
VSCode 插件
代码快捷键
在 VScode 的首页可以设置通用快捷键,因为平常用sublime比较多,所以干脆合并成一套。
代码提示
Path Intellisense
自动路径补全
Document this
js 的注释模板 (注意:新版的 vscode 已经原生支持,在 function 上输入 /** tab )
代码格式
ESlint
代码规范,对不符合要求的代码或者有语法错误的JS代码进行提示,可以自定制提示规则。
HTMLHint
html代码检测。
beautify
格式化代码的工具。
代码可视化改善
colorize
可视化颜色哦,做组件涉及很多不同的主题,个人还是蛮稀饭的。
RegExp Preview and Editor
这个就厉害了.可以完美的展示你写的正则,图形化给你看你写正则的形成。
Better Comments
最好用的注释区域高亮,对于TODO这些支持也很好。
BreadCrumb in StatusBar
----------------------------------------------------------------------------
华丽丽的分割线,以下插件根据框架语言选择,用什么装什么,不用就不要装了,浪费内存
React 插件
ES7 React/Redux/GraphQL/React-Native snippets
涵盖的代码片段贼丰富,React 相关代码提示有这个就够了。
Useful React Snippets
当然如果你只用React,那用这个代码提示吧,管够了。
CSS Blocks
支持 css 模块化的智能提示,跳转,墙裂推荐。
styled-components-snippets
styled-components 的代码片段。
Vue 插件
vetur
语法高亮、智能感知、Emmet 等。
VueHelper
snippet 代码片段。
Vue VSCode Snippets
很全面的vue代码片段。
Node
eggjs
蛋框的相关帮助插件,代码片段,智能提示等
egg-jump-definition
蛋框的函数跳转:Cmd+4。
微信小程序
mpvue snippets
mpvue的一些代码片段,以及部分原生小程序的代码提示。
minapp
用VS Code写小程序必备的插件,里面有众多实用的特性集成。
Markdown 插件
Markdown All in One
Markdown 的提示插件用这一个足以,集成了语法快捷键、Math、预览等,很实用。
markdownlint
对 markdown 的语法格式规范进行代码提示。
代码审查
CodeMetrics
可以计算TS/JS内代码的复杂度(比如函数这些),这些与代码质量和性能是挂钩的。
Import Cost
就是你import一个东西的时候,可以计算改引入模块的大小。
Git Lens
暂时没有发现比这个看git记录更为详细了。
其他
面的插件可有可无,如有相应功能的需求,却也是非常棒的插件。
fileheader
顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间。
1
ctrl+alt+i
Paste JSON as Code
JSON 格式转换成其他的语言格式。
Node.js Modules Intellisense
对于 node_module 的智能提示 。
npm-import-package-version
显示导入的 npm 包的版本信息
File Tree View
提供几个常见编程语言的函数或状态的树集合展示,可以快速点击跳转!!
NPM-Scripts
在侧边栏可视化执行 npm 命令(项目内的package.json), 小巧实用.
:emojisense:
---------------------
作者:JayveeWong
来源:CSDN
原文:https://blog.csdn.net/weixin_42776111/article/details/86483630
版权声明:本文为博主原创文章,转载请附上博文链接!
转载:VScode 好用插件集合的更多相关文章
- VScode 好用插件集合(一)
VScode 好用插件集合(一) 什么是VScode Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语 ...
- VSCode 前端常用插件集合
Visual Studio Code 是由微软开发的一款免费.跨平台的文本编辑器.由于其卓越的性能和丰富的功能,它很快就受到了大家的喜爱. 但工欲善其事必先利其器,以下是本人为前端开发收集的常用的vs ...
- 踩坑:VScode 集成 eslint 插件
本文以 Vue 官方脚手架 Vue-cli 为例: 1. 创建 Vue 项目 注意:Vue-cli 默认给出了 eslint 配置,一路回车即可.最后在安装模块的时候,选择直接安装!我用淘宝镜像安装时 ...
- 转载:Eclipse+Spket插件+ExtJs4修改版提供代码提示功能[图]
转载:Eclipse+Spket插件+ExtJs4修改版提供代码提示功能[图] ExtJs是一种主要用于创建前端用户界面,是一个基本与后台技术无关的前端ajax框架.功能丰富,无人能出其右.无论是界面 ...
- vscode格式化代码插件Beautify
vscode格式化代码安装 VsCode 格式化代码插件搜索并安装 Beautify 格式化代码插件使用:打开要格式化的文件 —> F1 —> Beautify file —> 选择 ...
- vscode安装dlv插件报错:There is no tracking information for the current branch.
vscode安装dlv插件报错:There is no tracking information for the current branch. https://blog.csdn.net/a7859 ...
- vscode安装golang插件失败问题
vscode安装golang插件失败问题 dlv go-outline go-symbols gocode-gomod gocode 代码补全 godef 代码跳转 golint gopkgs gor ...
- VSCode安装jshint插件报错
Mac电脑上使用VSCode安装jshint插件时提示如下错误: Failed to load jshint library. Please install jshint in your worksp ...
- VSCode高效开发插件
VSCode 必装的 10 个高效开发插件 https://www.cnblogs.com/parry/p/vscode_top_ten_plugins.html 本文介绍了目前前端开发最受欢迎的开发 ...
随机推荐
- curl 和 wget 命令
1. curl curl 支持 HTTP.HTTPS.FTP 等协议,还支持 POST.cookies.认证.从指定偏移处下载部分文件.User-Agent.限速.文件大小.进度条等特征. 1.1 选 ...
- Vue混入:全局混入
一 项目结构 二 main.js import Vue from "vue"; import App from "./App.vue"; Vue.config. ...
- _exit和exit的区别
在linux的标准库函数中,有一套称作高级I/O的函数,我们熟知的printf .fopen .fread .fwrite都在此列,他们也被称作缓冲I/O.其特征是对应每一个打开的文件,都存在一个缓冲 ...
- JS中substring()的用法
例一: <script type="text/javascript"> var str="Hello world!" document.write( ...
- ac自动机(tree+kmp模板)
Keywords Search Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others ...
- 2019牛客暑期多校训练营(第一场) - B - Integration - 数学
https://ac.nowcoder.com/acm/contest/881/B https://www.cnblogs.com/zaq19970105/p/11210030.html 试图改写多项 ...
- php开启xdebug扩展及xdebug通信原理
xdebug调试原理 IDE(如PHPStorm)已经集成了一个遵循BGDP的XDebug插件,当开启它的时候, 会在本地开一个XDebug调试服务,监听在调试器中所设置的端口上,默认是9000,这个 ...
- 【刷题】java 常见的几种运行时异常RuntimeException
常见的几种罗列如下: -NullPointerException - 空指针引用异常 ClassCastException - 类型强制转换异常. IllegalArgumentException - ...
- 为什么需要在 React 类组件中为事件处理程序绑定this?
https://juejin.im/post/5afa6e2f6fb9a07aa2137f51 事件绑定作为回调函数参数传递给函数,丢失其上下文,执行的是默认绑定,不是隐式绑定 类声明和类表达式的主体 ...
- JS高级 —— 普通函数、构造函数、对象方法的调用
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...