构建与预览
运行 vite build 和 vite preview,在本地验证生产构建
构建与预览 是 CoddyKit 上的免费 Sveltejs Academy 课时。 这是第 4 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 Sveltejs Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 Sveltejs Academy 课程共包含 4 节课。
构建命令
请运行构建脚本,生成可用于生产环境的输出。
npm run build构建的作用
Vite 会打包、树摇和压缩您的代码。SvelteKit 会应用所选的适配器。
本地预览
请使用预览脚本,在本地测试生产构建。
npm run preview为什么需要预览
预览环境比开发环境更接近生产环境:它提供构建后的代码包,而不是经过 HMR 处理的代码。
构建输出
默认情况下,输出会写入 build/。每个适配器都会自定义其结构。
构建错误
TypeScript 错误和导入问题会在这里显示。请在部署前修复它们。
性能审计
请针对 npm run preview 运行 Lighthouse,以评估实际性能。
代码包分析
请添加 vite-bundle-visualizer 或 rollup-plugin-visualizer,以检查代码包的组成。
环境文件
生产构建默认使用 .env.production;开发环境使用 .env。
源映射
请启用生产环境源映射以监控错误,并在隐私性与可调试性之间进行权衡。
持续集成构建
请在部署前于持续集成环境中运行构建,以便尽早发现问题。
快速检查
npm run preview 的作用是什么?
回顾
请使用 build 进行生产构建,使用 preview 在部署前进行本地的类生产环境测试。
常见问题解答
「构建与预览」课时是免费的吗?
是的 — 「构建与预览」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 Sveltejs Academy 课程的其余内容,请升级到 CoddyKit PRO。 Sveltejs Academy 课程共包含 4 节课。
「构建与预览」这节课中我会学到什么?
运行 vite build 和 vite preview,在本地验证生产构建 你通过在浏览器中直接运行的动手代码来练习 Sveltejs Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 Sveltejs Academy 需要有经验吗?
无需任何先前经验。CoddyKit 上的 Sveltejs Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 4 节课,共 4 节。
「构建与预览」课时需要多长时间?
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。
我能在这节 Sveltejs Academy 课中编写并运行代码吗?
能。每节 Sveltejs Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。