生产部署 ​

开发与生产 ​

在开发过程中，Vue 提供了多项功能以提升开发体验

• 对常见错误和陷阱的警告
• 属性/事件验证
• 响应性调试钩子
• 开发工具集成

然而，这些功能在生产环境中将变得无用。一些警告检查也可能导致轻微的性能开销。在生产部署时，我们应该移除所有未使用的仅限开发的代码分支，以减小负载大小并提高性能。

无需构建工具 ​

如果你使用 CDN 或自托管脚本加载 Vue 而不使用构建工具，确保在生产部署时使用生产构建（以 .prod.js 结尾的 dist 文件）。生产构建已经预先压缩，并移除了所有仅限开发的代码分支。

• 如果使用全局构建（通过 Vue 全局访问）：使用 vue.global.prod.js。
• 如果使用 ESM 构建（通过原生 ESM 导入访问）：使用 vue.esm-browser.prod.js。

有关详细信息，请参阅dist 文件指南。

使用构建工具 ​

通过 create-vue（基于 Vite）或 Vue CLI（基于 webpack）生成的项目已预先配置为生产构建。

如果使用自定义设置，请确保

1. vue 解析为 vue.runtime.esm-bundler.js。
2. 编译时功能标志配置正确。
3. 在构建过程中，process.env.NODE_ENV 被替换为 "production"。

其他参考资料

• Vite 生产构建指南
• Vite 部署指南
• Vue CLI 部署指南

跟踪运行时错误 ​

应用级别的错误处理器（app-level error handler）可以用来向跟踪服务报告错误

import { createApp } from 'vue'

const app = createApp(...)

app.config.errorHandler = (err, instance, info) => {
  // report error to tracking services
}

例如，Sentry 和 Bugsnag 也为 Vue 提供了官方集成。