监控与维护
监控生产应用并确保其稳定运行
监控与维护 是 CoddyKit 上的免费 Vue Academy 课时。 这是第 3 节课，共 3 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 Vue Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 Vue Academy 课程共包含 3 节课。
上线之后
发布不是终点，而是开始。健康的应用需要持续监控以捕获错误，需要分析以了解使用情况，还需要定期维护以保持安全和更新。
为什么要跟踪错误
除非您收集错误，否则用户设备上发生的错误对您来说是不可见的。错误跟踪会捕获生产环境中的崩溃，让您能够修复用户遇到的问题，通常还能在用户报告之前发现问题。
使用 Sentry 跟踪错误
Sentry 是广泛使用的错误跟踪服务。安装其 SDK，并在应用启动时初始化它，以自动捕获未处理的错误。
npm install @sentry/vue初始化 Sentry
使用项目的 DSN 和 Vue 应用实例初始化 Sentry，使其能够接入 Vue 的错误处理机制。
import * as Sentry from "@sentry/vue"
import { createApp } from "vue"
import App from "./App.vue"
const app = createApp(App)
Sentry.init({
app,
dsn: "https://example@sentry.io/123"
})
app.mount("#app")捕获自定义错误
除了自动捕获之外，您还可以手动报告已处理的错误，以获取代码已经捕获的问题的上下文信息。
try {
riskyOperation()
} catch (err) {
Sentry.captureException(err)
}添加分析
分析可以告诉您用户实际如何使用应用：访问哪些页面、点击什么内容、在哪些地方流失。这些数据能够指导产品决策。
跟踪页面浏览
借助 Vue Router，您可以使用路由钩子在每次导航时发送页面浏览事件。
router.afterEach((to) => {
trackPageView(to.fullPath)
})保持依赖项更新
过时的软件包会积累错误和安全漏洞。请定期检查更新并应用更新，同时边更新边测试。
npm outdated
npm update审查安全漏洞
运行安全审计，查找依赖树中的已知漏洞，并应用可用的修复。
npm audit
npm audit fix监控生产环境性能
真实用户使用的设备和网络各不相同。请使用真实用户监控（通常内置于错误工具中）以及加载时间等指标，确保发布后性能仍然良好。
处理破坏性变更
大版本更新可能会引入破坏性变更。请阅读变更日志和迁移指南，在分支中进行更新，运行测试套件，并在合并前修复问题。测试能让这一过程更安全。
快速检查
检验您对监控和维护的掌握情况。
回顾
发布后，使用错误跟踪（Sentry）进行监控，使用分析了解用户行为，通过 npm outdated 和 npm audit 保持软件包最新，并关注生产环境性能。借助测试套件谨慎处理破坏性变更。接下来您将探索高级模式和最佳实践。
常见问题解答
「监控与维护」课时是免费的吗？
是的 — 「监控与维护」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 Vue Academy 课程的其余内容，请升级到 CoddyKit PRO。 Vue Academy 课程共包含 3 节课。
「监控与维护」这节课中我会学到什么？
监控生产应用并确保其稳定运行 你通过在浏览器中直接运行的动手代码来练习 Vue Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 Vue Academy 需要有经验吗？
无需任何先前经验。CoddyKit 上的 Vue Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 3 节课，共 3 节。
「监控与维护」课时需要多长时间？
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。
我能在这节 Vue Academy 课中编写并运行代码吗？
能。每节 Vue Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。