Nuxt 2 静态构建改进
nuxt export，用于预渲染页面，而无需触发 webpack 构建，目的是分离渲染和构建过程。唯一的问题是，大多数 Nuxt 用户无法发挥分离的全部潜力……直到现在。
简介
在 Nuxt 2.13 版本中，引入了 完全静态模式。此外，还添加了一个新的命令 nuxt export，用于预渲染页面，而无需触发 webpack 构建，目的是分离渲染和构建过程。唯一的问题是，大多数 Nuxt 用户无法发挥分离的全部潜力……**直到现在。**
更快的静态部署
在 v2.14 中，nuxt generate 将**自动跳过 webpack 构建步骤（如果代码没有更改）**，并使用缓存中的先前构建结果。这将有助于通过避免不必要的构建（通常是生成过程中最耗时的部分）来大幅缩短静态部署时间。缓存支持**与平台无关**，可以在 Netlify、Vercel 或任何其他缓存 node_modules 的 CI/CD 设置中使用。
生成时间：缓存与完整 webpack 构建
查看两个 nuxt generate 命令之间的秒级对比
Build表示需要 webpack 构建Cache表示仅在内容发生更改时（跳过 webpack 构建）
项目链接：基本示例、Strapi 模块文档、Content 模块文档 和 Nuxt 2 文档。
在您的项目中使用
- 将
nuxt更新到最新的次要版本，即 v2.14。
npm update
- 确保
target在您的nuxt.config中设置为static
export default {
target: 'static'
// ...
}
如果您保留 target: ‘server’ 或未指定 target，则 nuxt generate 的行为将与之前相同，以避免出现重大更改并提供向后兼容性。
- 就是这样 🙌
现在，nuxt generate 命令仅在必要时构建项目，即项目内部文件发生更改时。它将始终重新渲染路由到静态 HTML 文件，就像 nuxt export 已经做的那样。
现在，您只需将构建命令从 nuxt build && nuxt export 改回 nuxt generate，即可在您使用的平台上使用。如果您使用 CI，请确保您正在正确缓存 node_modules。
从缓存中排除文件
默认情况下，nuxt 会忽略这些目录，因此如果其中任何文件发生更改，都不会触发构建
- 构建目录 (
.nuxt/) - 静态目录 (
static/) - 生成 dist 目录 (
dist/) node_modulesREADME.md- 隐藏的点文件（如
.npmrc）
您可以使用 nuxt.config 中的 generate.cache.ignore 选项添加更多模式。
export default {
generate: {
cache: {
ignore: [
// When something changed in the docs folder, do not re-build via webpack
'docs'
]
}
}
}
也可以为 ignore 选项使用函数来覆盖默认的忽略条目。
模块作者
如果您正在开发一个与文件交互的 Nuxt 模块，而这些文件不应该触发重新构建，该怎么办？最好的例子是 @nuxt/content 模块，它从存储库中读取 Markdown 文件。在这种情况下，这些文件在运行时模块中使用，当使用 @nuxt/content 时，模块本身就可以告诉 Nuxt 忽略这些文件，因此您无需执行任何操作！模块作者可以使用新的 generate:cache:ignore 钩子来实现这一点。
nuxt.hook('generate:cache:ignore', ignore => ignore.push('content'))
工作原理
当使用新的 nuxt generate 和 static 目标时，一个包含非忽略项目文件校验和以及 Nuxt 版本和其他一些配置的快照将被写入 .nuxt/build.json。此外，我们还将构建目录移动到 node_modules/.cache/nuxt。因为 node_modules 被所有主要平台（Netlify、Vercel 等）和常见的 CI/CD 脚本缓存，所以此解决方案无需额外配置即可开箱即用。
当随后调用 nuxt generate 时，它将再次根据您的项目文件创建校验和，然后将其与 node_modules/.cache/nuxt/build.json 中的现有校验和进行比较。
如果它们匹配，则表示没有任何需要重新构建的更改，因此我们可以直接开始渲染页面。
如果检测到不匹配，则表示需要进行完整重建。您还可以通过检查控制台日志来查看哪个文件导致了重建。构建完成后，nuxt generate 将保存 .nuxt/build.json 中的新校验和。您可以 此处 查看完整的实现。
回到旧的命令
在 Nuxt v2.13 中，我们引入了 nuxt export 和 nuxt serve，它们专门为静态目标而设计。在 Nuxt v2.14 中，它们已弃用，因为 nuxt generate 和 nuxt start 能够智能地检测目标并在必要时进行构建。
服务器目标
nuxt dev= 开发服务器nuxt build= 构建您的应用程序以用于生产环境nuxt start= 启动生产服务器（将其用于 Node.js 托管，例如 Heroku、Digital Ocean 等）
静态目标
nuxt dev= 开发服务器nuxt generate= 如果需要，构建并静态导出到dist/nuxt start= 像您的静态托管一样服务dist/目录（Netlify、Vercel、Surge 等），非常适合在部署前进行测试
接下来该做什么
- 将您的项目升级到 [email protected]
- 使用
nuxt generate代替nuxt export - 使用
nuxt start代替nuxt serve - 享受快速部署 🤙