vscode使用教程

本文介绍了如何在VSCode中进行前端开发的配置,包括安装语言插件、主题设置、调试工具、代码格式化、自动定位CSS样式以及推荐的Vue开发插件vetur,以提升开发效率。
摘要由CSDN通过智能技术生成

快捷键

ctrl + shift + p ⇒ 调出设置框

在这里插入图片描述

安装语言插件

安装好之后 会变成灰色
在这里插入图片描述

修改主题Theme

在这里插入图片描述

配置前端 js css html vue等

推荐视频地址
学废了,VS Code 网页前端开发的配置与插件

ps: 直接输入 ! tab就可以生成html 模板
使用右箭头嵌套也可以生成
在这里插入图片描述

配置同步修改标签功能

在这里插入图片描述
勾选Linked Editing
在这里插入图片描述

添加中文插件

在这里插入图片描述

在这里插入图片描述

安装前端使用浏览器调试插件

在这里插入图片描述

安装前端代码格式化插件

也可以用快捷键 alt+shift+F 格式化代码

在这里插入图片描述
将这里的默认工具选成prettier

在这里插入图片描述

勾选Format On Save ⇒ 保存的时候会自动格式化代码
ps:多人开发的大型项目最好把代码格式化关了
在这里插入图片描述

安装自动定位css样式插件

在这里插入图片描述

安装代码快速插入

在这里插入图片描述

添加括号颜色变化插件

最新版本已经这个插件内置进了VScode中

在这里插入图片描述

在回调地狱里可以看清当前的代码是在哪个代码块内
在这里插入图片描述

vue插件

vue2版本目前最好用的插件 vetur
在这里插入图片描述


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值