VSCode 拓展插件推荐

插件列表

Auto Close Tag 自动闭合HTML标签

Auto Rename Tag 修改HTML标签时,自动修改匹配的标签

Bookmarks 添加行书签

Can I Use HTML5、CSS3、SVG的浏览器兼容性检查

Code Runner 运行选中代码段(支持大量语言,包括Node)

CodeBing 在VSCode中弹出浏览器并搜索,可编辑搜索引擎

Color Highlight 颜色值在代码中高亮显示

Color Picker 拾色器

Document This 注释文档生成

EditorConfig for VS Code EditorConfig 插件

Emoji 在代码中输入emoji

ESLint ESLint插件,高亮提示

File Peek 根据路径字符串,快速定位到文件

Font-awesome codes for html FontAwesome提示代码段

ftp-sync 同步文件到ftp

Git Blame 在状态栏显示当前行的Git信息

Git History(git log) 查看git log

GitLens 显示文件最近的commit和作者,显示当前行commit信息

Guides 高亮缩进基准线

Gulp Snippets Gulp代码段

HTML CSS Class Completion CSS class提示

HTML CSS Support css提示(支持vue)

HTMLHint HTML格式提示

Indenticator 缩进高亮

JavaScript (ES6) code snippets ES6语法代码段

language-stylus Stylus语法高亮和提示

Lodash Lodash代码段

markdownlint Markdown格式提示

MochaSnippets Mocha代码段

Node modules resolve 快速导航到Node模块

npm 运行npm命令

npm Intellisense 导入模块时,提示已安装模块名称

Output Colorizer 彩色输出信息

Partial Diff 对比两段代码或文件

Path Autocomplete 路径完成提示

Path Intellisense 另一个路径完成提示

Prettify JSON 格式化JSON

Project Manager 快速切换项目

REST Client 发送REST风格的HTTP请求

Settings Sync VSCode设置同步到Gist

String Manipulation 字符串转换处理(驼峰、大写开头、下划线等等)

Test Spec Generator 测试用例生成(支持chai、should、jasmine)

TODO Parser Todo管理

Version Lens package.json文件显示模块当前版本和最新版本

vetur 目前比较好的Vue语法高亮

View Node Package 快速打开选中模块的主页和代码仓库

vscode-icons 文件图标,方便定位文件

VSCode Great Icons 文件图标拓展

VueHelper Vue2代码段(包括Vue2 api、vue-router2、vuex2)

附录:VSCode首选项配置

{
    "editor.tabSize": 2,
    "files.associations": {
        "*.vue": "vue"
    },
    "eslint.autoFixOnSave": true,
    "eslint.options": {
        "extensions": [
            ".js",
            ".vue"
        ]
    },
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "vue",
        "vue-html"
    ],
    "search.exclude": {
        "**/node_modules": true,
        "**/bower_components": true,
        "**/dist": true
    },
    "emmet.syntaxProfiles": {
        "javascript": "jsx",
        "vue": "html",
        "vue-html": "html"
    },
    "extensions.autoUpdate": true,
    "editor.renderWhitespace": "boundary",
    "editor.cursorBlinking": "smooth",
    "workbench.welcome.enabled": true
}

参考:http://www.cnblogs.com/zzsdream/p/6592429.html.
时间: 2024-11-05 21:37:12

VSCode 拓展插件推荐的相关文章

VScode前端插件推荐

工欲善其事,必先利其器,安利一波前端插件. Chinese (Simplified) Language Pack for Visual Studio CodeVScode汉化插件 Beautify代码自动美化插件 Bracket Pair Colorizer括号有颜色容易区分的插件 vscode-icons文件图标插件 open in browser打开浏览器插件 Prettier代码格式化插件 Quokka是一个调试工具插件,能够根据你正在编写的代码提供实时反馈,方便demo操作 Path I

#VSCode保存插件配置并使用 gist 管理代码片段

setting sync 保存配置 由于公司和家里都使用 VSCode 作为主要编辑器,同步配置是最紧要的.VSCode 提供了setting sync插件,很方便我们同步插件配置.引用网上教程: 在左侧的 sidebar 选中最后一个,搜索 Sync,不出意外,你会从前几个中找到下载量很高的那个 Settings Sync: 安装后,摁下 Ctrl + Shift + P 打开控制面板,搜索 Sync,选择 update/upload 可以上传你的配置,选择 Download 会下载远程配置:

VScode前端插件安利

因为暑假实习是前端,感觉以后做leetcode可能会没什么时间,记录一下平时自己用的一些插件. vscode 插件推荐 HTML Snippets HTML CSS Support vscode-icon Bootstrap 3 Sinnpet 原文地址:https://www.cnblogs.com/WuLiang-cola/p/9216489.html

ATOM常用插件推荐

simplified-chinese-menu ATOM的汉化插件 file-icons 文件图标美化 atom-beautify 代码格式一键美化 last-cursor-position 光标自由切换到上一次/下一次编辑位置 minimap 代码小地图 sync-settings 插件备份.按键绑定备份 activate-power-mode 输入时有震撼效果 tortoise-svn svn插件 atom-terminal-panel atom内置命令行工具 Git/github  git

chrome 优秀的插件推荐

就本人使用过的chrome插件推荐下: 1:Adblock Plus 免费的广告拦截器,可阻止所有烦人的广告及恶意软件和跟踪. 2:ChaZD 英文翻译,妈妈再也不用担心我英文看不懂了,ChaZD 查字典,简洁易用的英汉字典扩展程序,支持划词哦:) 3:Proxy SwitchySharp  轻松快捷地管理和切换多个代理设置,配合Shadowsocks,可上google.

intellij idea 13&14 插件推荐及快速上手建议 (已更新!)

原文:intellij idea 13&14 插件推荐及快速上手建议 (已更新!) 早些年 在外企的时候,公司用的是intellij idea ,当时也是从eclipse.MyEclipse转过去的很是不习惯. 用了一周明显感觉爱上它了.因为它很智能,而且能纠正你很多不好的习惯. 后来跳巢到一家上市公司.因为大家都在用MyEclipse,要求开发工具统一.没办法只能转回MyEclipse.不过个人倒是一直关注intellij idea版本的发布和新的功能. 最近开始使用intellij idea

十个jQuery图片画廊插件推荐

jQuery的画廊插件可以将分组图像和多媒体资料转成类似Flash的图像或照片.当幻灯片已经成为网站的重要组成部分,jQuery的重要性不能被忽视.下面为你介绍了10个最有美感,创新性和创造性的jQuery图片画廊插件: 1.How to Create a Simple Slideshow using Mootools / JQuery 当我们想要在有限的屏幕空间展示很多内容,这要使用到幻灯片.幻灯片是最佳的可以展现大量的信息的方式.在这篇文章中我将展示使用MooTools / Jquery做出

Webstorm功能详解及插件推荐

Web前端开发神器--Webstorm不用多介绍,强大的智能提示只是它的一个功能特性,它还具有许多有用的特性,比如版本控制.本地历史.即时模板等.Webstorm还内置了对 SASS.NodeJS.CoffeeScript.Jade 的支持,并且可自定义代码格式化规则.   Webstorm有哪些优势? 1.         图片宽高提示 平时在做前端开发时,一个页面中会碰见很多图片,如果我们在写img标签时能清楚的看见每个图片的宽高,岂不是太爽了?这一点Webstrom便可以实现. 2.   

10 款强大的JavaScript图表图形插件推荐

转自:http://www.iteye.com/news/24535 网上有很多用于绘制图表图形的免费JavaScript插件和图表库,这类插件大量出现的原因,一是人们不再依赖于Flash,二是浏览器和精密的计算使呈现实时数据变得容易,而且各种向量绘图技术像VML.SVG和Canvas的发展也使之成为可能. 本文推荐10款强大的绘制图表图形的JavaScript插件.其中一些插件需要主流浏览器的支持,而另外一些经过整合后,也能在不同的平台和老版本的浏览器上工作.有些工具是独立的框架,大部分支持常