VS Code下载安装使用教程
目录
- VS Code下载安装使用教程
- 一、下载
- 二、安装
- 三、使用教程
- 3.1 VS Code中的第一个页面HelloWorld.html
- 3.2 VS Code插件安装
- 3.2.1 安装中文界面
- 3.2.3 安装 Open in Browser插件
- 3.2.4 安装Auto Rename Tag插件
- 注意:
- 3.3 `code .`命令,即可用VSCode打开项目目录
- 3.4 VS Code 主题风格 以及文件图标插件安装和使用
- 3.4.1 颜色主题
- 3.4.2 文件图标主题
- 3.5 设置默认浏览器 开启本地服务器
一、下载
VS Code下载官网:https://code.visualstudio.com/
点击Download for Windows
点击Download
选择Windows即可
二、安装
双击安装包
点击我同意,然后点击下一步
选择安装路径,然后点击下一步
点击下一步
全选,然后点击下一步
点击安装
安装完成
三、使用教程
3.1 VS Code中的第一个页面HelloWorld.html
点击 文件->新建文件
将文件保存在磁盘中
输入一个英文的感叹号,选泽第一个然后回车
就自动生成了html骨架
VS Code下的第一个程序
<!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>Hello World</title>
</head>
<body>
Hello World!!!
</body>
</html>
浏览器运行测试
点击运行->启动调试
3.2 VS Code插件安装
3.2.1 安装中文界面
使用 Ctrl+Shift+P 打开命令界面
输入 display 选中 Configure Display Language
选中 Install additional language
或者按照下图操作
3.2.3 安装 Open in Browser插件
作用 右击选泽浏览器打开html文件
3.2.4 安装Auto Rename Tag插件
作用:自动重命名配对的HTML/XML标签
注意:
插件安装完成后,一定要重启软件
3.3 code .
命令,即可用VSCode打开项目目录
3.4 VS Code 主题风格 以及文件图标插件安装和使用
3.4.1 颜色主题
其他颜色主题
点击 “+浏览其他颜色主题”
3.4.2 文件图标主题
点击“安装其他文件图标主题”
选择Material Icon Theme点击安装
3.5 设置默认浏览器 开启本地服务器
VS Code为我们提供了热更新插件