文章目录
- bug描述
- 心酸过程：我的第一反应：Node 版本不对？
- 转机：换个关键词搜索
- 解决方案：锁定版本号！
- 步骤 1：删除 `^`，固定版本
- 步骤 2：彻底清理重装
- 步骤 3：重新启动
- 血泪教训 & 经验总结
- 不要盲目换 Node 版本！
- 老项目务必锁定依赖版本！
- 遇到报错，先搜完整错误关键词！
- .mjs 报错 = 现代 JS 语法 + 旧构建工具不兼容
- 维护老项目时，最好保留一份 package-lock.json！
- 写在最后
bug描述
今天接到一个“简单”任务：给一个以前的老Vue项目改个小功能。
我信心满满地拉下代码，执行：
npminstallnpmrun serve结果——直接报错！😓
错误信息赫然写着：
./node_modules/vue-router/dist/vue-router.mjs心酸过程：我的第一反应：Node 版本不对？
我问同事，他们也说：“我们都能跑，应该是你 Node 版本问题。”
于是……我开始了疯狂的版本切换之旅：
从 v16.17.1 → v18.20.8 → v20.19.4
安了删，删了安，重启终端、清缓存、重装依赖……
整整折腾了 3 个小时！
但——还是报同样的错！
我快崩溃了 😭
转机：换个关键词搜索
实在不行，我冷静下来，复制报错中的关键路径：@ ./node_modules/vue-router/dist/vue-router.mjs
粘贴到百度，终于！找到了几篇真实踩过坑的人写的记录。
其中一条点醒了我：
安装vue-router时没有指定版本,然后npm自动下的是最新版（vue-router版本太高和vue2起冲突了）
🔥 真相大白：版本自动升级惹的祸！
打开 package.json，一看：
"dependencies":{"vue-router":"^4.0.14",}问题就出在这个^上！^4.0.14表示：安装4.x的最新版。
解决方案：锁定版本号！
步骤 1：删除^，固定版本
"dependencies":{"vue-router":"4.0.14",}步骤 2：彻底清理重装
删除node_modules和package-lock.json
步骤 3：重新启动
npmrun serve成功运行！世界清净了！
血泪教训 & 经验总结
不要盲目换 Node 版本！
很多报错和 Node 无关，而是依赖版本冲突。
老项目务必锁定依赖版本！
删除 ^ 和 ~，使用精确版本号，避免自动升级引入不兼容包。
遇到报错，先搜完整错误关键词！
AI 回答可能泛泛而谈，但真实开发者踩过的坑记录往往一针见血。
.mjs 报错 = 现代 JS 语法 + 旧构建工具不兼容
尤其在 Vue 2 项目中，看到 vue-router.mjs 基本就是版本装错了。
维护老项目时，最好保留一份 package-lock.json！
它能确保每次安装的依赖完全一致。
写在最后
这次经历让我深刻体会到：技术问题不怕难，怕的是方向错了还死磕。
下次再遇到奇怪报错，我会先问自己：
“是不是依赖版本不对？是不是新旧框架混用了？”
希望这篇记录能帮到同样被 .mjs 折磨的你！
少走弯路，多喝热水，代码无 bug！ 💻✨
✍️ 作者： 一个被老项目虐哭又复活的前端
📅 日期： 2025年12月 17日
🔗 欢迎转发，禁止搬运