如何构建next.js项目并将其手动部署到Netlify



根据文档,Netlify通过Essential Build Plugin支持next.js,并通过CLI命令手动部署,但我如何在自己的CI中同时使用这两者来构建next.js项目,并仅将构建输出部署到Netlify?

插件页面提到";链接";,即,它假设该项目是通过Git存储库连接的,由netlify构建,而不是由我自己的CI在本地构建。

好吧,终于开始工作了。把它包装起来,以防其他人发现它有用:

  • 安装程序包netlify-cli@netlify/plugin-nextjs
  • 如插件README的本节所述,在项目根目录中创建netlify.toml(确保具有publishfunctions的路径;服务器端重渲染和API处理程序需要functions;在生成期间,这两个目录都将用于生成输出(
  • 如果使用Git,请将路径和.netlify(另一个"temp"目录(添加到.gitignore,以从repo中排除构建输出
  • 重要(在netlify项目上的前一个/过时的下一个的文档中找到了信息,没有这些信息就无法部署(:将target: "experimental-serverless-trace"添加到next.config.js
  • 对于初始设置:netlify login到您的帐户,运行netlify deploy --build一次,选择一个站点名称
  • 如果要在CI中运行部署,请配置环境变量NETLIFY_AUTH_TOKEN(来自Netlify UI的"个人访问令牌"(和NETLIFY_SITE_ID(在选择名称并成功完成第一次成功部署后显示在Netlify UI中(,以在将来绕过登录和站点选择

安装netlify-cli@netlify/plugin-nextjs

yarn add -D @netlify/plugin-nextjs
yarn add -D @netlify/plugin-nextjs

设置netlify.toml文件

[[plugins]]
package = "@netlify/plugin-nextjs"
[build]
command = "yarn next build"
publish = ".next"

配置NETLIFY_AUTH_TOKENNETLIFY_SITE_ID环境变量

在Netlify用户设置中为个人访问令牌手动生成访问令牌。这也可以通过命令行来完成。在终端设置或连续集成(CI(工具的UI中将令牌另存为NETLIFY_AUTH_TOKEN环境变量。

站点ID可在Netlify UI中找到:转到站点设置>概述>网站详细信息>站点信息,并复制API ID的值,将ID分配给NETLIFY_SITE_ID环境变量。这也可以通过netlify链接命令来完成。


构建Next.js应用程序并将其部署到Netlify

netlify deploy --build --prod


文档

  • https://docs.netlify.com/configure-builds/file-based-configuration/
  • https://github.com/netlify/netlify-plugin-nextjs
  • https://docs.netlify.com/cli/get-started/#run-本地生成
  • https://docs.netlify.com/cli/get-started/#manual-部署

更长的文章

https://paulonteri.com/thoughts/deploy-nextjs-to-netlify-manually

相关内容

  • 没有找到相关文章

最新更新