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

  1. Debugger for Chrome

VS中启动Chrome控制台

在这里插入图片描述

  1. Auto Rename Tag

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

在这里插入图片描述

  1. background

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

在这里插入图片描述

  1. Beautify

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

在这里插入图片描述

  1. Bootstrap 3 Snipper

方便补全代码段

在这里插入图片描述

  1. Chinese

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

在这里插入图片描述

  1. ESLint

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

在这里插入图片描述

  1. Git History

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

在这里插入图片描述

  1. GitLens — Git supercharged

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

在这里插入图片描述

  1. HTML CSS Support

智能提示CSS类名以及id

在这里插入图片描述

  1. HTML Snippets

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

在这里插入图片描述

  1. jQuery Code Snippets

jQuery代码智能提示

在这里插入图片描述

  1. jQuery Snippets

所有在jquery的片段开发

在这里插入图片描述

  1. JS-CSS-HTML Formatter

保存时自动格式化代码

在这里插入图片描述

  1. Live HTML Previewer

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

在这里插入图片描述

  1. Live Server

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

在这里插入图片描述

  1. npm

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

在这里插入图片描述

  1. npm Intellisense

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

在这里插入图片描述

  1. open in browser

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

在这里插入图片描述

  1. Path Autocomplete

在vscode中使用@提示路径

在这里插入图片描述

  1. Quokka.js

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

在这里插入图片描述

  1. Vetur

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

在这里插入图片描述

  1. View In Browser

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

在这里插入图片描述

  1. VS Color Picker

选择颜色，转换颜色

在这里插入图片描述

  1. vscode-icons

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

在这里插入图片描述

  1. Vue 3 Snippets

Vue代码提示

在这里插入图片描述

  1. Vue VSCode Snippets

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

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

Vetur的分支

在这里插入图片描述

  1. any-rule

正则提示

在这里插入图片描述

# vscode # vue.js # 前端
Logo
View Design

基于 Vue 的企业级 UI 组件库和中后台系统解决方案，为数万开发者服务。

更多推荐

cover

vue+element ui实现好看的登录界面

avatar ViewDesign

vue3.0中使用elementUi(element-plus的使用)

element-plus的使用小朋友，你是不是有很多问号❓❓❓甲：为什么在vue3.0中不能使用Element UI了？乙：由于vue3.0在插件install函数的入参从Vue原型（类）改成了app（vue实例），导致element-ui中Vue.prototype.* 这样的代码已经全都失效了。所以element-ui铁定是不兼容了。甲：那有什么方法能解决吗？乙：使用Element UI的升级

avatar ViewDesign

ElementUI 整体页面布局

一、概述一般后台页面的顶部导航栏和左侧导航栏一般是固定的，我们可以布局成下面的样式二、整体项目布局因为我们的首页是个公共的组件，点击首页，会员管理，都不会变，所以我们可以放在一个单独文件夹里面。需要分别对头部，左侧区域，主区域拆分成不同的文件。创建项目创建一个全新的ElementUI 项目，请参考链接：https://www.cnblogs.com/xiao987334176/p...

avatar ViewDesign