---------------------
Author: JayveeWong
Source: CSDN
Original: https: //blog.csdn.net/weixin_42776111/article/details/86483630
Disclaimer: This article as a blogger original article, reproduced, please attach Bowen link!
What is VSCode
Visual Studio Code (abbreviated VS Code / VSC) is a free open source lightweight modern code editor, syntax highlighting support for almost all major development languages, smart code completion, custom shortcuts, brackets matching and color-coded, code snippets, code, contrast Diff, GIT commands and other features to support plug-in extensions, and the cloud for web development and application development optimized. Cross-platform software support Win, Mac and Linux, run smoothly, can be described as Microsoft's conscience ......
VSCode Download: https: //code.visualstudio.com/
According to a survey, VScode and sublime front-end developers prefer the IDE. Relative to these two software, I prefer actually VSCode, this post will record it relatively easy to use VSCode plug.
VSCode plug
Code shortcuts
in VScode home page can be set common shortcuts, because the more usual with sublime, so simply merged into a set.
Code hints
Path Intellisense
Automatic route completion
Document this
js Notes template (Note: The new version of vscode has native support for input on the function / ** tab)
Code format
ESlint
Code specification, the code does not meet the requirements or grammatical errors JS code tips, rules can be customized prompt.
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
版权声明:本文为博主原创文章,转载请附上博文链接!