走进前端、VSCode插件的安装及其使用
目录
一、走进前端
二、VSCode简单介绍
三、VSCode的下载及安装
四、VSCode插件的安装
五、部分插件及其使用
1.汉化
2.Bracket Pair Colorizer
3.markdownlint
4.open in browser
5.Path Intellisense
6.Prettier
7.vscode-icons
8.Indent-Rainbow
9.Atuo Rename Tag
10.filesize
一、走进前端
前端，也称web前端，通俗地讲：实现与用户沟通交互，展示给用户的，用户看到的网页浏览器界面，安装的软件应用程序等就是前端。
前端开发需要掌握HTML、CSS、JS等来提供前端应用运行的代码，前端应用的多媒体内容是由图片和视频等提供的。
前端应用由一个或多个应用页面构成，应用页面也俗称为网页或简称为页面。只有一个页面的前端应用成为单页面应用，而多页面应用是通过多个页面间的静态或动态链接而相互管理起来的应用。
二、VSCode简单介绍
VSCode的全称是Visual Studio Code，它可以运行于 Mac OS、Windows 和 Linux平台 ，具有 JavaScript，TypeScript 和 Node.js 的内置支持，还具有例如 C++、C#、Java、Python、PHP、Go 运行时的生态系统,是微软于2015年发布的一款免费开源的现代化轻量级代码编辑器。
三、VSCode的下载及安装
可以直接在官网下载，进入官网后点击download（一般在右上角）按照需求选择版本后即可下载。
官网链接：Visual Studio Code - Code Editing. Redefined
安装时注意勾选：将通过code 打开“操作添加到windows资源管理器文件上下文菜单”和将通过code 打开“操作添加到windows资源管理器目录上下文菜单”，便可以对文件使用鼠标右键，选择VSCode 打开。建议勾选：添加到PATH（重启后生效），便可以使用控制台打开VSCode 。
四、VSCode插件的安装
点击vscode左下面的拓展按钮或者ctrl + shift + x，就会出现搜索框，搜索你想要的插件即可。搜索后在右边还会出现该插件的详细功能，点击安装，等待后就会将目标插件安装成功。安装完成后重启vscode，就可以了。同样，也可以在插件的详情界面将已安装的插件禁用或卸载。
五、部分插件及其使用
1.汉化
按下Ctrl+Shift+P打开搜索框，输入Configure Display Language，设置 zh-cn 关闭软件重启。
汉化插件：Chinese (Simplified) Language Pack for Visual Studio Code。
2.Bracket Pair Colorizer
会在代码中给括号添上成对的颜色，便于识别和区分。
3.markdownlint
可以检测我们markdown的语法，进行语法纠错，使我们形成良好的markdown书写习惯。
4.open in browser
VSCode 没有提供直接在浏览器中打开文件的内置界面，此插件在快捷菜单中添加了在默认浏览器查看文件的选项，可以在默认游览器打开你的网页然后进行预览。
5.Path Intellisense
可自动填充文件名，自动补全路径。
6.Prettier
Prettier 是目前 Web 开发中最受欢迎的代码格式化程序。安装了这个插件，它就能够自动应用 Prettier，并将整个 JS 和 CSS 文档快速格式化为统一的代码样式。
7.vscode-icons
可以使VScode左侧的资源管理器根据文件类型显示图标。
8.Indent-Rainbow
为文本前面的缩进着色，在每个步骤中交替使用不同的颜色。使我们能够直观地找出代码缩进的不一致之处，使代码更加美观。
9.Atuo Rename Tag
修改 html 标签，自动帮你完成头部和尾部闭合标签的同步修改，进行重命名。
10.filesize
会在状态栏显示当前文件的大小，点击后可以看到详细的创建和修改时间。
走进前端、VSCode插件的安装及其使用相关推荐
- 走进前端 VScode插件安装 Gitee提交
一,认识前端 什么是前端 前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页.前端技术一般分为前端设计和前端开发,前端设计理解为网站网页的视觉设计,前端开发则是网站前台代码的实现, ...
- 走进前端，vscode插件的安装及使用
Part One 走进前端 一.概述 web前端开发源网站设计,使用各种技术和框架创建页面系统呈现给用户的过程,通过编写代码的方式将图片.文字等素材在页面进行合理布局,达到与效果图相同的效果.前端开发 ...
- vscode插件默认安装位置
vscode插件默认安装位置: C:\Users\用户名\.vscode\extensions
- 前端vscode插件合集
工欲善其事必先利其器 安装步骤 . . . . . . . . . 1.中文包Chinese (Simplified) Language Pack for Visual Studio Code 2.自 ...
- vscode插件离线安装
最近新入职公司,使用远程桌面办公.打开vscode时,发现vetur插件都没有安装.于是开始自己离线安装. 在vscode插件库(Extensions for Visual Studio family ...
- 走进前端和VSCO的安装及使用
前端 前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页.随着互联网技术的发展,HTML5,CSS3,前端框架的应用,跨平台响应式网页设计能够适应各种屏幕分辨率,完美的动效设计,给 ...
- 前端vscode插件bito
GPT-4和ChatGPT越来越火,前端人员是否也能在日常工作中尝试体验其带来的乐趣呢? 答案是可以的!安排!! 今天介绍一款vscode的插件 [bito]. 安装 安装后只需要自己注册一下,创建一 ...
- 关于VSCode插件的安装位置
VSCode的插件地址修改_上善若泪-CSDN博客_vscode插件位置文章目录1 data文件夹2 使用--extensions-dir命令3 使用mklink命令vscode编辑器强大的地方是可以 ...
- VsCode插件手动安装
VsCode是款轻量级的编程环境,提供了丰富的插件库,由于本人机器只能通过浏览器代理浏览网页,所以插件安装就比较麻烦,只能先下载下来再手动安装,具体方法如下. 1.下载需要的vscode版本 http ...
最新文章
- MongoDB：逐渐变得无关紧要
- POJ 3420 Quad Tiling
- 如何使用.NET配置文件(二)
- EXCLE使用中常用函数和公式
- cmf php,cmf公共函数解析-common.php
- 【Gym - 101196F】Removal Game （环形区间dp，环状，细节优化）
- Typora主题定制及常用配置的设置方法
- 16、document的_source元数据以及定制返回结果解析
- 官方实力榜：绿军居首黄蜂第二 火箭小降雄鹿飙升
- 计算机主板 安装系统,Intel NUC迷你电脑安装win7 BIOS设置（适用英特尔主板）
- unity帧动画事件多次播放
- Chris Cheung
- 弘辽科技：如何做好淘宝店铺推广？有什么技巧吗？
- 面向对象程序设计实验——编写Rational类
- 什么样的游戏最适合GameFi？
- 柯西飞行，瑞利飞行，莱维飞行，重尾分布、随机游走
- Revit SDK EXTENSIONS(软件开发工具包扩展)是什么
- 今日新网络舆情信息监测收集技术解决办法
- ROS2机器人笔记20-12-04
- cannot be used as a JSX component