美文网首页Web前端之路Vue.js专区
Visual Studio Code 扩展推荐

Visual Studio Code 扩展推荐

作者: 0非空0 | 来源:发表于2017-10-25 10:34 被阅读1719次

    由于VSCode貌似没有导出扩展列表的功能,所以在此记录下自己经常用到的一些扩展,同时也推荐给更多的朋友,希望能对大家有所帮助。
    扩展列表按名称排序

    Auto Close Tag

    输入开始标签后,自动添加结束标签。比如输入<div>,自动添加</div>

    Auto Rename Tag

    更改HTML/XML标签名时,自动更新相对应的开始标签或结束标签的标签名

    Beautify

    格式化javascript,JSON,CSS,Sass和HTML代码

    Better Comments

    编写更加人性化的注释


    Annotated codeAnnotated code

    Bookmarks

    添加行书签

    C#

    使用VSCode编写C#代码必须的,安装之后在默认打开.cs文件时 还会自动下载调试器等

    C# Extensions

    C#扩展插件,强烈推荐,可以帮你在建立文件的时候初始化文件内容包括对应的命名空间等

    C# XML Documentation Comments

    可以快速的帮你添加注释,如同在VS里面使用///来添加注释

    Can I Use

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

    Code Outline

    函数变量列表

    Code Runner

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

    Color Highlight

    颜色代码高亮插件

    Color Info

    提供你在 CSS 中使用颜色的相关信息。你只需在颜色上悬停光标,就可以预览色块中色彩模型的(HEX、 RGB、HSL 和 CMYK)相关信息了

    Color Picker

    拾色器

    CSScomb

    css属性排序

    cssrem

    px转换为rem

    Debugger for Chrome

    方便js调试的插件,前端项目在Chrome中运行起来之后,可以直接在VSCode中打断点、查看输出、查看控制台,需要配置launch.json,详情见插件说明。

    Document This

    jsdoc注释生成

    EditorConfig for Visual Studio Code

    ESLint

    这是个esint规则校验扩展。vs code 会自动找到你工程中的.eslintrc和.eslintignore。你只需要设置下elsint选项。

    Express

    使用Visual Studio代码中的Express Web服务器托管当前工作空间

    File Peek

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

    Font-awesome codes for html (snippets)

    FontAwesome提示代码段

    Git Blame

    可以查看当前光标所在位置的Git Log,最近一次提交的人和时间,显示在左下角

    Git History

    查看git log

    Guides

    高亮缩进基准线

    HTML CSS Support

    css提示(支持vue)

    HTML Snippets

    增强了zen-coding,增加了H5的自动补全,安装后每次打开自动启用

    Import Cost

    在引入npm包同时获取所用包的体积,可配置显示格式(minified or gziped)

    Indenticator

    缩进高亮

    IntelliSense for CSS class names

    CSS类名工具

    JavaScript (ES6) code snippets

    es6代码片段

    JavaScript Standard Style

    JavaScript 标准编码风格

    • 使用两个空格 – 进行缩进
    • 字符串使用单引号 – 需要转义的地方除外
    • 不再有冗余的变量 – 这是导致 大量 bug 的源头!
    • 无分号 – 这里有3篇文章说明不用分号的好处:文章1 文章2 文章3
    • 行首不要以 (, [, or `开头
    • 关键字后加空格 if (condition) { ... }
    • 函数名后加空格 function name (arg) { ... }
    • 坚持使用全等 ===摒弃 ==一但在需要检查 null || undefined时可以使用 obj == null
    • 一定要处理 Node.js 中错误回调传递进来的 err参数。
    • 使用浏览器全局变量时加上 window前缀 – documentnavigator除外
    • 避免无意中使用到了这些命名看上去很普通的全局变量, open, length,event 还有 name
    • 请参阅 完整的规则列表

    npm

    运行npm命令

    Npm Intellisense

    对package.json内中的依赖包的名称提示

    Output Colorizer

    彩色输出信息

    Path Autocomplete

    路径完成提示

    Path Intellisense

    文件路径补全

    Prettify JSON

    格式化JSON

    SpellChecker

    自然语言的拼写检查

    SVG Viewer

    svg预览

    Trailing Spaces

    突出显示尾随空格并将其删除

    Version Lens

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

    vetur

    vue单文件能够像html,js,css一样编写,注释

    View In Browser

    右键在浏览器打开

    Visual Studio Code Format

    vscode代码格式增强工具

    vscode-icons

    美化VSCode的界面,在文件名前面显示小图标

    Vue 2 Snippets

    vue2的语法高亮,语法提示

    VueHelper

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

    wpy-beautify

    vue2单文件格式化

    相关文章

      网友评论

        本文标题:Visual Studio Code 扩展推荐

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