VScode现在已经越来越完善。性能远超Atom和webstorm,你有什么理由不用它?
在这里,我会给你们推荐很多实用的插件,让你对 vscode 有更深刻的体会,渐渐地你就会知道它有多好用。

走马观花前,请先将你的 vscode 更新到最新版本。

通用插件

HTML Snippets

超级实用且初级的 H5代码片段以及提示

HTML CSS Support

让 html 标签上写class 智能提示当前项目所支持的样式
新版已经支持scss文件检索

Debugger for Chrome

让 vscode 映射 chrome 的 debug功能,静态页面都可以用 vscode 来打断点调试,真666~ 
配置稍微复杂一些,哪天心情好我再另写教程吧~

jQuery Code Snippets

jquery 重度患者必须品,废话不多说,上图

vscode-icon

让 vscode 资源树目录加上图标,必备良品!

Path Intellisense

自动路劲补全,默认不带这个功能的,赶紧装

Npm Intellisense

require 时的包提示(最新版的vscode已经集成此功能)

Document this

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

ESlint

ESlint 接管原生 js 提示,可以自定制提示规则。这个比较高玩,不会的就算了,
详情配置请看我的另一篇文章 https://segmentfault.com/a/11...

HTMLHint

html代码检测

Project Manager

在多个项目之前快速切换的工具

beautify

格式化代码的工具

Bootstrap 3 Sinnpet

常用 bootstrap 的可以下

Atuo Rename Tag

修改 html 标签,自动帮你完成尾部闭合标签的同步修改,不过有些bug。

GitLens

丰富的git日志插件

fileheader

顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间

filesize

在底部状态栏显示当前文件大小,点击后还可以看到详细创建、修改时间

Bracket Pair Colorizer

让括号拥有独立的颜色,易于区分。可以配合任意主题使用。

Vue插件

以下推荐vue框架所需的插件

vetur

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

VueHelper

snippet代码片段

Import Cost

引入包大小计算,对于项目打包后体积掌握很有帮助

主题

Material

冷门、好看、实用。此主题已停更许久

Dracula

目前我觉得是vscode上最漂亮的主题,vscode 1.11+允许自定义statusBar等全局ui后,该主题也跟进改了很多小细节,良心!~

One Dark Pro

源于Atom,老版本的Atom One Dark主题可以扔了.

Bimbo

vscode 插件推荐 - 献给所有前端工程师的更多相关文章

  1. [转]vscode 插件推荐 - 献给所有前端工程师(2019.8.7更新)

    原文地址:https://segmentfault.com/a/1190000006697219 VScode现在已经越来越完善.性能远超Atom和webstorm,你有什么理由不用它?在这里,我会给 ...

  2. vscode 插件推荐 - 献给所有前端工程师(2018.4.29更新)

    大家好,我是Moer.VScode现在已经越来越完善.性能远超Atom和webstorm,你有什么理由不用它?在这里,我会给你们推荐很多实用的插件,让你对 vscode 有更深刻的体会,渐渐地你就会知 ...

  3. vscode 插件推荐 - 献给所有前端工程师(更新与2018.8.1)

    VScode现在已经越来越完善.性能远超Atom和webstorm,你有什么理由不用它?在这里,我会给你们推荐很多实用的插件,让你对 vscode 有更深刻的体会,渐渐地你就会知道它有多好用. 走马观 ...

  4. react开发vscode插件推荐

    原文地址:https://github.com/xieqingtian/blog/issues/2 由于本人主要是做react开发,用的代码编辑器是传说中的宇宙第一前端神器vscode, 所以在这里记 ...

  5. VScode 插件推荐与C/C++配置

    以下是我经常用到的VScode插件.由于插件本身具有详细的配置和介绍,不对插件本身的安装配置进行说明,仅仅支出这些插件的主要功能.具体使用强烈推荐看一下安装插件后的说明,大多数的问题和设置都可以找到, ...

  6. vscode插件推荐

    在扩展(Ctrl+Shift+X)中直接搜索这些插件的名字安装即可 1.HTML Snippets 超级使用且初级的H5代码片段以及提示 2.HTML CSS Support 让HTML标签上写cla ...

  7. VSCode 插件推荐

    vscode-icons  用于项目中文件类型显示对应的图标,提高文件定位的效率. vscode-tslint  用于 TS 的规范检测 Path Intellisense  用于提示导入文件时候的路 ...

  8. vscode前端常用插件推荐,搭建JQuery、Vue等开发环境

    vscode是微软开发的的一款代码编辑器,就如官网上说的一样,vscode重新定义(redefined)了代码编辑器.当前市面上常用的轻型代码编辑器主要是:sublime,notepad++,edit ...

  9. <IDE>vscode前端常用插件推荐,搭建JQuery、Vue等开发环境

    vscode是微软开发的的一款代码编辑器,就如官网上说的一样,vscode重新定义(redefined)了代码编辑器.当前市面上常用的轻型代码编辑器主要是:sublime,notepad++,edit ...

随机推荐

  1. HTML5新特性之文件和二进制数据的操作 Blob对象

    HTML5新特性之文件和二进制数据的操作 1.Blob对象 2.FileList对象 3.File对象 4.FileReader 对象 5.URL对象

  2. struts2,hibernate等模板配置文件在jar包中的路径,以及所需要的包

    一.struts2 1.struts的配置模板文件struts-default.xml的位置: struts-2.3.16.1 --> src --core --> src --> ...

  3. Disconf入门指南(1)

    Disconf简介 参考: https://github.com/knightliao/disconf/wiki/TutorialSummary 在一个分布式环境中,同类型的服务往往会部署很多实例.这 ...

  4. 实验一:JAVA实验环境搭建 ,JDK下载与安装及 Eclipse下载与安装

    一.搭建JAVA实验环境 1.JDK的下载 (1)打开 IE 浏览器,输入网址“http://www.oracle.com/index.html”,浏览 Oracle 官方主页.鼠标双击Downloa ...

  5. webpack学习笔记(2)--webpack.config.js

    3 模式 mode mode 参数设置为 development(开发模式), production(生产模式) 或 none(无),可以启用对应环境下 webpack 内置的优化.默认值为 prod ...

  6. Project Euler 41 Pandigital prime( 米勒测试 + 生成全排列 )

    题意:如果一个n位数恰好使用了1至n每个数字各一次,我们就称其为全数字的.例如,2143就是一个4位全数字数,同时它恰好也是一个素数. 最大的全数字的素数是多少? 思路: 最大全排列素数可以从 n = ...

  7. 4.1、Ansible模块

    ansible-doc -l    列出所有模块 ansible-doc 模块名    查看模块的help说明 ansible-doc -s  module_name:获取指定模块的使用信息 ***文 ...

  8. 基于Vue的事件响应式进度条组件

    写在前面 找了很多Vue 进度条组件!,都不包含拖拽和点击事件,input range倒是原生包含input和change事件,但是直接基于input range做进度条的话,样式部分需要做大量调整和 ...

  9. 【Codeforces Round #505 (rated, Div. 1 + Div. 2, based on VK Cup 2018 Final) B】Weakened Common Divisor

    [链接] 我是链接,点我呀:) [题意] 给你n个数对(ai,bi). 让你求一个大于1的数字x 使得对于任意的i x|a[i] 或者 x|b[i] [题解] 求出第一个数对的两个数他们有哪些质因子. ...

  10. 编译打包部署 Dubbo Admin

    1.下载,Dubbo地址: https://github.com/alibaba/dubbo/tree/2.5.x ,直接ZIP下载 2.解压并打开项目,mvn package 得到war包,如下图: ...