文章目录
- 前端开发工具--VsCode
- 前端开发基础语法
- VsCode优秀插件
- Chinese --中文插件
- Auto Rename Tag --自动重命名插件
- open in browser
- Open in Default Browser
- Open in Other Browser
- Live Server -- 实时预览
前端开发工具–VsCode
- 轻量级与快速启动
快速加载:VSCode 启动速度快,占用系统资源少,更适合快速编辑和调试代码。
灵活性:可以根据需要安装扩展,保持轻量,避免复杂功能的干扰。 - 强大的扩展性
丰富的插件生态:VSCode 拥有大量的插件,可支持各种编程语言、框架和工具,例如 React、Angular、Vue.js 和 SASS。
自定义功能:用户可以根据个人需求安装或开发扩展,提高开发效率。 - 智能代码补全
IntelliSense:提供上下文感知的代码补全,自动完成变量、函数、方法名等,有助于减少拼写错误和提高编码速度。
文档提示:在输入时,VSCode 会自动提供函数的文档和参数提示,帮助开发者更好地理解和使用 API。 - 内置调试功能
调试器:VSCode 提供强大的调试功能,可以直接在编辑器中设置断点、检查变量值、单步执行代码等,极大地提升了调试效率。
支持多种语言:支持 JavaScript、TypeScript 等多种语言的调试,便于前端开发者进行调试工作。 - 终端集成
内置终端:VSCode 内置终端,可以直接在编辑器中执行命令,无需切换到其他窗口,提升了工作流的效率。
Git 集成:内置 Git 功能,可以方便地进行版本控制、提交代码、解决冲突等操作。
前端开发基础语法
1.前端开发框架代码
< !DOCTYPE html>
< html lang=“en”>
< head>
< meta charset=“UTF-8”>
< meta http-equiv=“X-UA-Compatible” content=“IE=edge”>
< meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
< title>Document
< /head>
< body>
< /body>
< /html>
VsCode优秀插件
Chinese --中文插件
VsCode在刚下载完成后默认是英文的,这对我们这些中国程序员来说很不友好,为了解决这个问题我们可以选择在VsCode中安装一个这个插件,在安装并重启VsCode后VsCode便会将语言调整为中文。
Auto Rename Tag --自动重命名插件
这个插件能够帮助我们进行快捷的修改标签在我们修改前一个·标签,后一个标签也会改动。
open in browser
这个插件能够让我们选择想要的浏览器进行预览
Open in Default Browser
用默认的浏览器打开
Open in Other Browser
用其他浏览器打开(前提是你的电脑已经安装了这些浏览器)
Live Server – 实时预览
这个插件能够让我们实时看到我们修改后的代码的效果,而不需要在每次修改后都刷新浏览器。
由于篇幅的原因在这里便简单介绍一下一些比较重要的插件,黑马那边有更加全面的插件
https://www.bilibili.com/read/cv9698270/
快捷命令则是这个:
https://www.bilibili.com/read/cv9699783/