设为首页收藏本站

开启辅助访问

VSCode扩展(前端Vue开发使用)

您所在的位置：网站首页 › 使用vscode运行vue安装那些插件便于使用 › VSCode扩展(前端Vue开发使用)

VSCode扩展(前端Vue开发使用)

#VSCode扩展(前端Vue开发使用)| 来源: 网络整理| 查看: 265

以下扩展是我编写当前项目代码使用到的，记录一下

Debugger for Chrome

VS中启动Chrome控制台

在这里插入图片描述

Auto Rename Tag

重命名一个HTML / XML标签时，自动重命名配对的HTML / XML标签

在这里插入图片描述

background

这个就是一个非常可爱的美化背景，我称它为“小可爱”，每次编程都会心情美好，有bug报红也不能生气，哈哈哈

在这里插入图片描述

Beautify

自动对html，js，css进行格式化对齐显示

在这里插入图片描述

Bootstrap 3 Snipper

方便补全代码段

在这里插入图片描述

Chinese

把整个VSCode的文字转换成中文，就是说咱是中国人，虽然吧懂点英语，但是还是中文看着习惯些

在这里插入图片描述

ESLint

统一JavaScript代码风格的工具，不包含css、html等

在这里插入图片描述

Git History

使用git的时候，经常需要查看修改记录，或者需要查看谁提交了什么文件等，就可以使用这个，方便一些

在这里插入图片描述

GitLens — Git supercharged

一个项目通常是好几个人一起负责的，只是每个人负责不同的功能模块，但多少会有交集。有时候文件被改了某一处，git拉取和推送会有冲突，尤其是在休息下班的点，此时是不是特别想找到改你文件的人上去暴揍一顿，这个时候你就会特别需要这个插件，抓住他迅速解决掉问题，哈哈哈

在这里插入图片描述

HTML CSS Support

智能提示CSS类名以及id

在这里插入图片描述

HTML Snippets

智能提示HTML标签，以及标签含义

在这里插入图片描述

jQuery Code Snippets

jQuery代码智能提示

在这里插入图片描述

jQuery Snippets

所有在jquery的片段开发

在这里插入图片描述

JS-CSS-HTML Formatter

保存时自动格式化代码

在这里插入图片描述

Live HTML Previewer

不用另外打开浏览器，直接在Vscode里面预览html，并且会自动实时更新使用：F1 -> 弹出一个窗口输入live，然后右边出现预览窗口

在这里插入图片描述

Live Server

标准HTML页面浏览器自动刷新

在这里插入图片描述

npm

支持运行包中定义的npm脚本，package.json并根据中定义的依赖项验证已安装的模块package.json

在这里插入图片描述

npm Intellisense

用于在import语句中自动填充npm模块

在这里插入图片描述

open in browser

编辑器菜单右键html，在默认浏览器打开

在这里插入图片描述

Path Autocomplete

在vscode中使用@提示路径

在这里插入图片描述

Quokka.js

实时运行代码平台，会在你输入后立即运行代码，并在代码编辑器中显示各种执行结果

在这里插入图片描述

Vetur

支持标签、属性的智能补全等等

在这里插入图片描述

View In Browser

从浏览器中查看html文件，使用系统的当前默认浏览器

在这里插入图片描述

VS Color Picker

选择颜色，转换颜色

在这里插入图片描述

vscode-icons

图标集，资源管理器一目了然

在这里插入图片描述

Vue 3 Snippets

Vue代码提示

在这里插入图片描述

Vue VSCode Snippets

Vue文件编写自定义骨架结构

在这里插入图片描述 28. Vuter

Vetur的分支

在这里插入图片描述

any-rule

正则提示

在这里插入图片描述

【本文地址】

今日新闻

推荐新闻

CopyRight 2018-2019 办公设备维修网版权所有豫ICP备15022753号-3