nuxt.js发布部署

nuxt.js提供三种部署方式，服务端渲染部署，静态应用部署，单页面应用部署。

部署前远程服务器需要安装node，pm2，nginx

服务端渲染部署

nuxt.config.js 配置

    target: 'server', // 服务端渲染需要将target设置为server 默认是server

• 首先执行build打包

    npm run build

• 将".nuxt(隐藏项目)，static，nuxt.config.js, package.json"这四个文件放在服务器中

    npm run install, // 在服务器项目目录下执行安装依赖
    npm run start, // 可以执行测试一下项目是否能正常启动
    // 注意这边不要使用npm run dev（开发模式）

如果测试没有问题就可以使用pm2启动项目

• 在项目根目录使用pm2启动项目

    pm2 start npm --name "project name" -- run start

启动起来之后执行pm2 list可以查看到正在守护的pm2进程。

静态应用部署

nuxt.js可以依据路由配置将应用静态化，使得我们可以将应用部署到任何一个服务器静态站点。

nuxt.config.js 配置

    target: 'static',

• 打包生成dist文件

    npm run generate

最后将生成的dist文件放到服务器中

单页面应用程序部署（SPA）

nuxt generate在build、generate时间内仍然需要SSR引擎，同时具有预渲染所有页面的优势，并具有较高的SEO优化和页面加载能力。内容在构建时生成。

• 将nuxt.config.js中的mode更改为spa
• 运行npm run build
• 将生成的dist文件夹部署到服务器

nginx配置

    upstream test {
        server 0.0.0.0:3000; // 你的服务地址
        keepalive 64;
    }
    
   server {
        listen   80;
        server_name  baidu.com; //你的域名 
        location / {
            proxy_pass   http://test;
        }
    }