使用VScode配置BS开发环境

使用VScode配置BS开发环境

预备工作

关于如何下载或者安装VScode，网络上有许多介绍，这里不再赘述。简单贴出一些链接方便读者阅读：

BS配置文件

首先我们需要为BS的开发环境创建一个配置文件，请按顺序打开“文件->首选项->配置文件”
请点击“新建配置文件”，在右侧的配置曲填写对应的选项。以下作者的配置选项：
- 名称：前端
- 复制自：无
请点击“保存”，并切换到新建立的配置文件。

安装对应的扩展：

打开“扩展”选项卡，安装BS需要的扩展，以下是作者的扩展列表分享：

ESLint
Live Server
Path Intellisense
Prettier-Code formatter
HTML CSS Support
CSS Peak
Auto Import
Stylelint

创作一个简单的网站来检验效果

新建并在VScode中打开一个文件夹，在文件夹中新建index.html

index.html:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Test</title>
</head>
<body>
    <p>你的VScode已经被配置为前端开发</p>
</body>
</html>

点击Go Live，查看打开的浏览器页面查看成果