美文网首页程序员工具癖前端攻城狮
VScode 插件工具集,不求全但求好

VScode 插件工具集,不求全但求好

作者: 孤烟漠儿 | 来源:发表于2018-09-18 18:47 被阅读47次

    [更多插件可以到官网自行探索](https://marketplace.visualstudio.com/vscode)

    对前端感兴趣的小伙伴,可以关注我的 Github

    根据调查发现,VScode 和 sublime 是前端开发者比较喜欢的 IDE 。“工欲善其事,必先利其器”,我是一个爱折腾的工具控,刚开始用 VScode 的时候,装了一堆的插件,导致只要开启 VScode 再接上大屏,我的 Mac 就会强烈的反抗,风扇一直呼啸,😳😳....后来就开启卸载模式,开始一直卸,最终保留一些小而美,使用率高的插件,整理一份以便不备之需。

    而对于一个团队而言,大家用同一套快捷键,同一个IDE,同一套插件,那么结对编程将会是一件特别幸福的事情。和帅哥哥一起编程还是可以学到很多东西的,嘻嘻~~

    一、代码快捷键

    在 VScode 的首页可以设置通用快捷键,因为平常用sublime比较多,所以干脆合并成一套。

    二、代码提示

    1. Path Intellisense

    自动路径补全

    2. Document this

    js 的注释模板 (注意:新版的 vscode 已经原生支持,在 function 上输入 /** tab )

    三、代码格式

    1. ESlint

    代码规范,对不符合要求的代码或者有语法错误的JS代码进行提示,可以自定制提示规则

    2. HTMLHint

    html代码检测

    3. beautify

    格式化代码的工具

    四、代码可视化改善

    1. colorize

    可视化颜色哦,做组件涉及很多不同的主题,个人还是蛮稀饭的

    2. RegExp Preview and Editor

    这个就厉害了.可以完美的展示你写的正则,图形化给你看你写正则的形成

    ----------------------------------------------------------------------------

    华丽丽的分割线,以下插件根据框架语言选择,用什么装什么,不用就不要装了,浪费内存

    五、React 插件

    1. ES7 React/Redux/GraphQL/React-Native snippets

    涵盖的代码片段贼丰富,React 相关代码提示有这个就够了

    2. Useful React Snippets

    当然如果你只用React,那用这个代码提示吧,管够了

    3. CSS Blocks

    支持css模块化的智能提示,跳转,墙裂推荐

    4. styled-components-snippets 

    styled-components的代码片段

    六、Vue 插件

    1. vetur

    语法高亮、智能感知、Emmet 等

    2. VueHelper

    snippet 代码片段

    3. Vue VSCode Snippets

    很全面的vue代码片段

    七、Node

    1. eggjs

    蛋框的相关帮助插件,代码片段,智能提示等

    2. egg-jump-definition

    蛋框的函数跳转:Cmd+4

    八、微信小程序

    1. mpvue snippets

    mpvue的一些代码片段,以及部分原生小程序的代码提示

    2. minapp

    用VS Code写小程序必备的插件,里面有众多实用的特性集成

    九、Markdown 插件

    1. Markdown All in One

    Markdown 的提示插件用这一个足以,集成了语法快捷键、Math、预览等,很实用

    2. markdownlint

    对 markdown 的语法格式规范进行代码提示

    十、总结

    有了这些插件就可以早点下班啦~~

    想找萝卜或者想找坑的童鞋,可以加入我们的“前端内推群”,里面有BATJ等大厂的HR,同时也有精通React、Vue、Node、小程序的大佬。

    如果加不进去,可以请小妹喝杯咖啡,加我微信,我会拉你进去。(注明一下你的title哦)

    相关文章

      网友评论

        本文标题:VScode 插件工具集,不求全但求好

        本文链接:https://www.haomeiwen.com/subject/wojmnftx.html