17-必装扩展推荐前端开发篇

前端开发涉及 HTML、CSS、JavaScript 的频繁切换，还需要实时预览、代码格式化、路径补全等工具支持。本章推荐的前端扩展将大幅提升你的开发效率，每个扩展都配有具体的操作演示。

在开发静态网页时，每次修改都要手动刷新浏览器非常低效。Live Server 实现了\”改代码即刷新\”的体验。

安装：搜索 Live Server（作者: Ritwick Dey）

核心功能：

操作
快捷键/路径
说明

启动服务	在 HTML 文件上右键 > “Open with Live Server”	启动本地服务器并打开浏览器
启动服务	状态栏点击\”Go Live\”按钮	底部状态栏出现
停止服务	状态栏点击端口号（如\”Port: 5500\”）	关闭服务器

实操演练：

创建 index.html 文件，写入简单内容：<!DOCTYPE html>
<html>
<head>
<title>Live Server Test</title>
<style>
body {

font-family: sans-serif; padding: 2rem; }
h1 {

color: #007acc; }
</style>
</head>
<body>
<h1>Hello, Live Server!