网上找不到称手的工具，我决定自己做一个

找不到称手的工具

我的日常工作里，经常需要临时处理一些文件：裁剪图片、转换格式、给视频截字幕区域。

每次都要在网上翻一圈找在线工具。找到的要么功能不对，要么满屏广告，要么要注册才能用，要么要把文件上传到别人的服务器。

这种事情经历多了，我就想：这些操作前端完全能做，为什么不自己做一个？

一天搭起来

2025 年 1 月 23 日，我花了一天时间把基础架构搭好了。

技术栈选了 Nuxt 3 + TypeScript + Tailwind CSS。Nuxt 的 SSG 模式可以生成纯静态页面，加载快，部署简单。文件处理全部在浏览器端完成，数据不会离开用户的设备。

第一天上线的工具：

• 贪吃蛇 — 用来验证游戏交互能力
• 迷宫游戏 — 带音效和移动端控制
• 电影字幕裁剪 — 真实需求，批量裁剪视频截图中的字幕区域

同时搭好了整个工具框架：导航栏、侧边菜单、工具卡片组件、分类体系。后面加新工具只需要写页面逻辑，框架层的事情不用再操心。

随时随地，手机也能用

做这个工具箱有一个重要的前提：手机也能用。

我不是总在电脑前，很多时候是在手机上临时需要处理个文件。所以从第一天起，移动端适配就是必须的，不是"以后再说"的事。

贪吃蛇和迷宫游戏都做了移动端触控操作，字幕裁剪支持拖拽选区。在手机浏览器里打开 metool.online 就能直接用。

起步很轻，但框架要对

回头看，第一天最重要的不是上线了几个工具，而是把架构搭对了：分类体系、组件复用、路由规范。这些决定了后面能不能快速扩充工具，而不是每次都从头写。

工具箱刚刚开始，积压的需求还有一堆。