网站开发工具
打开 Visual Studio Code，左边文件树里躺着三个项目：一个用 Vue 3 加 Vite 搭的工具客户官网，一个 WordPress 老站，网站还有一个我自己写着玩的工具小工具——纯 HTML 加一点 Alpine.js。光标在 index.html 里闪，网站我盯着那个 flex 布局，工具突然觉得工具这东西，网站用对了是工具顺手的螺丝刀，用错了就是网站砸到脚上的锤子。
前阵子帮朋友看一个后台管理系统。工具他用了 create-react-app，网站启动要 40 秒，工具热更新像老牛拉破车。网站我问他为什么不用 Vite，工具他说“教程里都这么写”。网站我当场掏出终端，npm create vite@latest 敲下去，十秒后一个新项目跑起来了。他愣了半天，说原来工具换代这么快。确实，2024 年还在用 Webpack 硬扛大型项目的人不少，但 Vite 的冷启动和 HMR 体验，一旦用过就回不去了。这不是喜新厌旧，是时间成本太真实。
代码编辑器这块，VS Code 仍然是那个“什么都能干”的瑞士军刀。我装了大概 30 个扩展，但常用的就那几个：Prettier 格式化、ESLint 查错、Live Server 快速预览。有意思的是，我最近把 Prettier 的 printWidth 从 80 改到 100，整个项目的换行都变了——工具的参数微调，直接影响代码的呼吸感。JetBrains 的 WebStorm 我也试过，智能提示确实强，但打开大项目时内存吃得厉害，我的 M1 MacBook Air 风扇会转。所以还是回到 VS Code，轻，快，插件生态够用。
“工具不是越新越好，是越适合当前这个坑越好。”——我修了三年电脑的表哥说的，虽然他只会装 360 安全卫士。
说到 CSS 工具，Tailwind CSS 是个分水岭。我第一次用的时候，看着 class="flex items-center justify-between p-4 bg-white rounded-lg shadow-md" 心里直骂：这跟内联样式有什么区别？但写完一个卡片组件后，我闭嘴了。改样式不用在 HTML 和 CSS 文件之间来回跳，响应式前缀 md: lg: 直接写，打包时自动摇树优化掉没用的类。当然，它不适合所有人——我那个写 WordPress 主题的朋友就坚持手写 SCSS，说“类名堆成山看着头疼”。这很合理，工具选择本来就是个人口味加项目约束。
调试工具呢？Chrome DevTools 还是那个每天必开的。但有个细节：我最近才发现 console.log 可以带 %c 加 CSS 样式，把日志变成彩色标签。比如 console.log('%c🔥 接口返回', 'color: orange; font-weight: bold', data)。这种小技巧没什么技术含量，但能让调试过程不那么枯燥。Lighthouse 我也跑，不过分数这东西，参考一下就行——真按它那个 100 分去抠，项目就不用上线了。
版本控制？Git 是底线，但 GUI 工具我用的是 Fork。命令行我也敲，git rebase -i 压缩提交很爽，但看 diff 的时候，Fork 的侧边对比视图比终端里 git diff 的绿红块舒服太多。有次合并冲突，我在终端里弄了十分钟没搞定，打开 Fork 三秒解决。工具就是干这个的——把重复劳动压缩成一次点击，把复杂逻辑变成可视化。
最后提一嘴部署。以前用 FTP 上传文件，现在想起来像石器时代。Netlify 和 Vercel 连上 GitHub 仓库，推代码自动构建部署，还能预览分支。我那个小工具站就挂在 Vercel 上，免费额度够用，自定义域名加 SSL 证书两分钟搞定。但也不是没坑——有次我用了服务端 API 路由，Vercel 的 Serverless 函数冷启动慢得让人想砸键盘。后来换到 Cloudflare Pages，边缘节点快多了。工具没有银弹，只有试错。
写到这，VS Code 右下角弹了个提示：Prettier 扩展有更新。我点了“稍后”。工具是拿来用的，不是拿来追的。顺手、稳定、能解决问题，比什么花哨功能都强。你手里那把螺丝刀，拧得动螺丝就行，管它是不是德国进口。
```