Nuxt.js 提供了两种发布部署应用的方式:服务端渲染应用部署 和 静态应用部署。

静态应用部署就不说了,主要说说服务端渲染应用部署。

官方部署方式

关于服务端渲染应用部署,官方文档是这么写的:

部署 Nuxt.js 服务端渲染的应用不能直接使用 nuxt 命令,而应该先进行编译构建,然后再启动 Nuxt 服务,可通过以下两个命令来完成:

nuxt build
nuxt start

推荐的 package.json配置如下:

{
"name": "my-app",
"dependencies": {
"nuxt": "latest"
},
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start"
}
}

提示: 建议将 .nuxt 加入 .npmignore 和 .gitignore 文件中。

意思是说.nuxt不加入到版本控制,每次服务器从gitlab上拉代码后先执行nuxt build生成.nuxt文件夹,然后再执行nuxt start来启动服务。

每次在服务器上执行nuxt build,总是有如下报错,并且jenkins会随之挂掉。

error Command failed with signal "SIGKILL".

看了一下服务器监控发现build的时候cpu和内存飙升,尤其是内存。。。

好吧,我买的是阿里最低配的ECS,升级配置是最后的选择,在这之前只能另辟蹊径。

既然服务器上build不了,那我们就本地build再上传,在.gitignore里把.nuxt去掉、并把dist改为/dist,然后本地执行yarn build,成功之后再上传到github上,检查一下.nuxt是否有上传上去。

之后在服务器上把代码拉下来、安装一下依赖,执行nuxt start就可以了。

这里还有个坑,就是为什么要把.gitignore里的dist改为/dist

/dist这个文件夹是执行nuxt generate后生成的,用来做静态应用部署的,这部分就跟通常情况下的.nuxt一样是不应该加入到版本控制里的,但由于nuxt build之后,在.nuxt里也会生成一个dist文件夹,我们希望gitignore的只有/dist而不是/.nuxt/dist,因此猜需要做出这里的修改。

我们使用pm2来部署nuxt。

pm2 start npm --name nuxt -- start

Nuxt.js部署应用的方式的更多相关文章

  1. nuxt.js部署vue应用到服务端过程

    由于seo的需要,最近将项目移植道nuxt.js下采用ssr渲染 移植完成后,一路顺畅,但是到了要部署到服务器端上时候,还是个头疼的问题,但最终还是顺利完成.现在记录一下部署中的过程. 注:部署时候过 ...

  2. nuxt.js 部署静态页面[dist]到gh-pages

    一. 1.添加package.json { "name": "nuxtweb001", "version": "1.0.0&quo ...

  3. nuxt.js express模板项目服务器部署

    nuxt版本:0.10.6 技术栈:nuxt.js, express, pm2 部署环境:windows server 之前用nuxt.js 的express的模板项目在windows下用nginx进 ...

  4. next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序

    前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...

  5. Nuxt.js服务端渲染实践,从开发到部署

    感悟 经过几个周六周日的尝试,终于解决了服务端渲染中的常见问题,当SEO不在是问题的时候,或许才是我们搞前端的真正的春天,其中也遇到了一些小坑,Nuxt.js官方还是很给力的,提issue后很积极的给 ...

  6. vue.js 服务端渲染nuxt.js反向代理nginx部署

    vue.js的官方介绍里可能提到过nuxt.js,我也不太清楚我怎么找到这个的 最近项目vue.js是主流了,当有些优化需求过来后,vue还是有点力不从心, 比如SEO的优化,由于vue在初始化完成之 ...

  7. 从壹开始 [ Nuxt.js ] 之二 || 项目搭建 与 接口API

    前言 哈喽大家周一好,今天的内容比较多,主要就是包括:把前端页面的展示页给搭出来,然后调通接口API,可以添加数据,这两天我也一直在开发,本来想一篇一篇的写,发现可能会比较简单,就索性把项目搭建的过程 ...

  8. vuejs服务端渲染更好的SEO,SSR完全指南Nuxt.js静态站生成器

    vuejs服务端渲染更好的SEO,SSR完全指南Nuxt.js静态站生成器SSR 完全指南https://cn.vuejs.org/v2/guide/ssr.html在 2.3 发布后我们发布了一份完 ...

  9. vue-nuxt.js部署到宝塔主机服务器

    废话不多说,直接上步骤,如下: 本文章为在 vue环境下使用了nuxt.js 1.搭建环境--由于本人安装的是宝塔主机,因此如下: 由于我直接使用的是宝塔主机,直接去“软件管理”安装 PM2管理器. ...

随机推荐

  1. 解决ant Design dva ajax跨越请求 (status=0)

    今天实现了antd作为前端展现,python flask作为后端的数据填充,完全两个独立的服务:过程中遇到ajax跨越请求问题,导致status一直等于0,原来是这么写的: xmlhttp.open( ...

  2. PHP Kohana入门体验教程

    打开入口文件kohana目录下的index.php, 左边选中的文件和右边选中的是对应,如果重命名的话两边都要修改. 设置程序默认时区D:\xampp\htdocs\kohana\applicatio ...

  3. 几个比较很重要的Shader相关教程

    1. 论坛上有个兄弟写个的ToonShaderModel,可以参考ShaderModelhttps://github.com/EpicGames/UnrealEngine/pull/1552/file ...

  4. Python3之弹性力学——应力张量1

    题目 已知某点的应力张量为: \[ \left[ \begin{array}{ccc} \sigma_{x} &\tau_{xy} &\tau_{xz}\\ \tau_{yx} &am ...

  5. Spring MVC中Controller返回值void时报错

    Controller如下: 当使用url访问该处理器方法时,报错如下: 26-Jan-2019 21:16:28.105 警告 [http-nio-8080-exec-39] org.springfr ...

  6. ES6字符串和正则表达式改动

    1. ES6字符串变更 (1)includes() 方法,如果在字符串中检测到指定文本返回true,否则返回false (2)startsWith()方法,如果在字符串的起始部分检测到文本,则返回tr ...

  7. 关于多线程之GCD的一些学习要点

    GCD是当前多线程使用最方便的,也是使用比较多的. 学习GCD主要集中在一下几点: 一.队列,同步,异步 1.主队列:dispatch_get_main_queue(); 2.串行队列:dispatc ...

  8. GMA Round 1 三视图

    传送门 三视图 该几何体如图所示,是一个边长为$2\sqrt{3}$的正四面体,高是$h=2\sqrt{2}$,内切球半径是$r=\frac{h}{4}=\frac{\sqrt{2}}{2}$,则体积 ...

  9. F - 质数检测 V2

    https://vjudge.net/contest/218366 Java解 import java.math.BigInteger; import java.util.Scanner; publi ...

  10. MUI学习01-MUI概括、使用前引入CSS及JS

    1.MUI含义 目标:追求性能体验,追求原生UI感觉 重要特征:轻量 优势:MUI不依赖任何第三方JS库,压缩后的JS和CSS文件仅有100+K和60+K 基础:MUI以iOS平台UI为基础,补充部分 ...