Nextjs打包还是非常方便的，就是网上资料不太全，导致踩了一些坑，下面是我亲自实践的两种打包方式。

一、node环境部署

这种方式最简单，也比较不容易出错，但部署时服务器需安装有node环境，速度没话说，杠杠的!

next build

构建好以后，打包好的文件默认放在/.next文件夹里

放到服务器上时仅需要如下几个部分文件即可：

next start
next start -p 80

启动前端服务即可。

二、静态导出

这种方法官网部署很详细，导致踩了不少坑，

运行命令：

next build && next export

默认的配置是会报错的，报错如下：

解决方法是在next.config.js文件里添加如下配置：

   images: {
        unoptimized: true
 将之前的/.next和out文件夹删除，重新执行上面命令就不会报错了，最后打包结果如下：
 
/out文件夹里
 
 此时，out文件夹放到nginx服务器里配置好代理路径为 "/"即可访问到，
 
但值得注意的是：
 
 可以看到使用了static模式导出后动态路由的api是被禁止掉的，所以使用静态导出时也需要考虑自己的代码是否有用到该API，若有则最好使用其他的方法或直接使用第一种打包方式。
 
补充：路由问题
 
最简单的方法
 
在next.config.js里添加上这个配置，很好用：
 
trailingSlash: true
 
最符合开发规范的方法
 
在Nginx服务器上配置如下：
 
以trailingSlash的默认值false导出后，nginx配置部署如下
 
server {
        listen       443 ssl;
        server_name  flydragon.site;
       //...
        location / {
            root   /www/wwwroot/out;
            index  index.html index.htm;
            //以下两行是关键，让服务器重定向
            try_files $uri $uri.html $uri/ =404;
            rewrite ^//(.*)$ //$1.html break;
        error_page 404 /404.html;
        location = /404 {
            internal;
成功案例：
 
总结完毕！
本文主要带大家学一下Next.js在生产环境下如何进行打包和在打包过程中遇到的一些坑。
其实Next.js大打包时非常简单的，只要一个命令就可以打包成功。
但是当你使用了Ant Desgin后，在打包的时候会遇到一些坑。
打包 ：next build
运行：next start -p 80
先把这两个命令配置到 package.json 文件里，比如配置成下面的样子。
"scripts": {
  "dev": "next dev",
  "build": "next bui
				
next-on-netlify是一个实用程序，用于在Netlify的Next.js中启用服务器端呈现。 它将您的应用程序包装在一个很小的兼容性层中，以便页面可以使用Netlify函数在服务器端进行呈现。
Netlify路线图的下一步
Netlify上Next.js的未来已经超越了next-on-netlify 。 推荐的前进路径是安装一个由next-on-netlify背后的团队发行并支持的构建插件。
 该插件依赖于next-on-netlify但提供了更流畅的体验，包括：
 一键式零配置安装
允许自定义功能并发布目录
有关更多信息，请参见。 我们团队的最终目标是使Netlify上