内容摘要：打开 VS Code 的那一刻，风扇就开始转了。这不是什么夸张修辞，是真实发生在我那台 8G 内存老笔记本上的事。前端开发软件的第一条铁律：它们吃资源，吃得理直气壮。 但你还是得用。因为写 HTML、

打开 VS Code 的前端那一刻，风扇就开始转了。软件这不是前端什么夸张修辞，是软件真实发生在我那台 8G 内存老笔记本上的事。前端开发软件的前端第一条铁律：它们吃资源，吃得理直气壮。软件

但你还是前端得用。因为写 HTML、软件CSS、前端JavaScript 这件事，软件用记事本干一天可以，前端干一年试试？软件所以问题不是“要不要用工具”，而是前端“用什么、怎么用”。软件

编辑器：VS Code 不是前端唯一答案，但确实是大多数人的答案

2015 年之前，前端圈还在争论 Sublime Text 和 Atom 谁更好用。后来 VS Code 出来了，免费、插件多、微软维护，三下五除二就把局面收了。我认识一个写了十年代码的老哥，至今还在用 WebStorm，理由是“重构功能比 VS Code 强一个档次”。这话没毛病，JetBrains 系的代码分析能力确实扎实。但 WebStorm 要钱，VS Code 不要。对大部分人来说，这个差距就够做决定了。

VS Code 真正好用的地方在插件生态。Prettier 管格式化，ESLint 管代码质量，Live Server 一键起本地服务，GitLens 让你看见每一行代码是谁写的、什么时候写的。装完这一套，基本能覆盖日常开发八成场景。剩下的两成，看你具体做什么方向。

构建工具：从“能用”到“好用”的代价

以前写前端，一个 index.html 加几个 script 标签就完事了。现在不行。你得有构建工具把 TypeScript 编译成 JavaScript，把 SCSS 编译成 CSS，把模块打包成一个文件。Webpack 统治了很多年，配置文件写得像天书。后来 Vite 出来了，开发环境启动速度从几十秒降到一两秒，热更新几乎无感。我第一次用 Vite 的时候愣了一下——改完代码，浏览器还没反应过来，页面已经更新了。

Vite 不是万能药。生产环境打包它用 Rollup，复杂项目的配置照样能写到你头疼。但至少开发体验这一块，它把 Webpack 按在地上摩擦。现在新项目基本默认 Vite，老项目迁移的也不少。Webpack 还在，只是不再是默认选项了。

浏览器开发者工具：最被低估的前端软件

很多人装了各种插件、各种调试工具，却忽略了浏览器自带的 DevTools。Chrome DevTools 的 Elements 面板能实时改样式，Network 面板能看每个请求的耗时和大小，Performance 面板能录一段操作然后告诉你哪一帧卡了。这些东西不需要额外安装，按 F12 就能用。

我见过工作三年的前端，调样式还在靠“改代码—保存—刷新”循环，不知道 Elements 面板可以直接改。这不是技术问题，是习惯问题。DevTools 用熟了，调一个布局问题的时间能从十分钟压到一分钟。省下来的时间干嘛不好。

版本控制：Git 不是可选项

前端开发软件里，Git 的地位有点特殊。它不算“前端专用”，但前端离了它基本没法协作。GitHub Desktop 也好，命令行也好，VS Code 内置的 Git 面板也好，选一个顺手的就行。关键是要用起来。我见过有人用“复制文件夹加日期后缀”来管理版本，2024 年了，真的。

Git 的学习曲线在前几天比较陡，过了那个坎就顺了。branch、merge、rebase 这几个概念搞明白，日常开发够用。遇到冲突别慌，慢慢解，解多了就熟了。

选工具的原则

前端工具更新快，今天流行的明天可能就凉了。选工具看三点：社区活跃度、文档质量、和你现有工作流的契合度。三点都满足，就用。满足两点，可以考虑。只满足一点，再火也别碰。

工具是拿来解决问题的，不是拿来供着的。顺手最重要。