调试 dist 目录下的 JavaScript 文件可以按照以下步骤进行：
1. 确保 Source Maps 正常生成
确认你的构建配置中已启用 Source Maps，确保 .map 文件与构建后的 .js 文件位于同一目录。
2. 启动一个本地服务器
使用本地服务器来服务 dist 目录，这样浏览器可以正确处理文件路径。例如，可以使用 http-server：
npm install -g http-server
http-server dist
3. 打开 Chrome DevTools
- 在浏览器中打开你的应用程序（例如
http://localhost:8080）。 - 使用
F12打开 Chrome DevTools。
4. 导航到 Sources 面板
- 在 DevTools 中，转到“Sources”标签页。
- 你应该能看到项目的文件结构，包括原始的
.vue文件和生成的 JavaScript 文件。
5. 设置断点
- 找到生成的 JavaScript 文件或相应的
.map文件，点击行号设置断点。 - 刷新页面，调试器将在断点处暂停，你可以检查变量、调用堆栈等。
6. 调试
- 使用调试工具的功能（如步进、监视变量等）进行调试。
确保你的浏览器没有缓存老版本的文件，必要时可以清除缓存。通过这些步骤，你应该能顺利调试 dist 目录下的 JS 文件！