VSCode Live Server 插件使用教程

1. 项目的目录结构及介绍

VSCode Live Server 插件的 GitHub 仓库（https://github.com/ritwickdey/vscode-live-server）包含以下主要目录和文件：

• .github: 包含 GitHub 相关配置文件，如 issue 模板和 pull request 模板。
• images: 包含插件的截图和演示图片。
• src: 包含插件的主要源代码。
  • src/helpers: 包含各种辅助函数和工具类。
  • src/models: 包含数据模型和接口定义。
  • src/services: 包含服务层代码，处理业务逻辑。
  • src/views: 包含用户界面相关的代码。
• .gitignore: 指定 Git 版本控制系统忽略的文件和目录。
• LICENSE: 项目的开源许可证。
• README.md: 项目的介绍文档。
• package.json: 项目的 npm 配置文件，包含依赖项、脚本和插件信息。

2. 项目的启动文件介绍

VSCode Live Server 插件的启动文件主要位于 src 目录下，具体包括：

• extension.ts: 这是插件的入口文件，负责初始化插件并注册各种命令和事件监听器。
• server.ts: 负责启动和管理本地开发服务器，处理静态和动态页面的实时重载功能。
• statusbar.ts: 管理状态栏的显示和操作，如启动和停止服务器的按钮。

3. 项目的配置文件介绍

VSCode Live Server 插件的配置文件主要包括：

• package.json: 这是 npm 包的配置文件，包含插件的元数据、依赖项、脚本和命令等信息。
  • contributes: 定义了插件在 VSCode 中的贡献点，如命令、菜单项和配置项。
  • activationEvents: 定义了插件的激活事件，如命令调用时激活插件。
• settings.json: 这是插件的用户配置文件，用户可以在其中自定义插件的行为，如服务器端口、自动刷新等设置。

通过以上介绍，您可以更好地理解和使用 VSCode Live Server 插件，提高前端开发的效率。