Nuxt.js部署应用的方式
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部署应用的方式的更多相关文章
- nuxt.js部署vue应用到服务端过程
由于seo的需要,最近将项目移植道nuxt.js下采用ssr渲染 移植完成后,一路顺畅,但是到了要部署到服务器端上时候,还是个头疼的问题,但最终还是顺利完成.现在记录一下部署中的过程. 注:部署时候过 ...
- nuxt.js 部署静态页面[dist]到gh-pages
一. 1.添加package.json { "name": "nuxtweb001", "version": "1.0.0&quo ...
- nuxt.js express模板项目服务器部署
nuxt版本:0.10.6 技术栈:nuxt.js, express, pm2 部署环境:windows server 之前用nuxt.js 的express的模板项目在windows下用nginx进 ...
- next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序
前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...
- Nuxt.js服务端渲染实践,从开发到部署
感悟 经过几个周六周日的尝试,终于解决了服务端渲染中的常见问题,当SEO不在是问题的时候,或许才是我们搞前端的真正的春天,其中也遇到了一些小坑,Nuxt.js官方还是很给力的,提issue后很积极的给 ...
- vue.js 服务端渲染nuxt.js反向代理nginx部署
vue.js的官方介绍里可能提到过nuxt.js,我也不太清楚我怎么找到这个的 最近项目vue.js是主流了,当有些优化需求过来后,vue还是有点力不从心, 比如SEO的优化,由于vue在初始化完成之 ...
- 从壹开始 [ Nuxt.js ] 之二 || 项目搭建 与 接口API
前言 哈喽大家周一好,今天的内容比较多,主要就是包括:把前端页面的展示页给搭出来,然后调通接口API,可以添加数据,这两天我也一直在开发,本来想一篇一篇的写,发现可能会比较简单,就索性把项目搭建的过程 ...
- vuejs服务端渲染更好的SEO,SSR完全指南Nuxt.js静态站生成器
vuejs服务端渲染更好的SEO,SSR完全指南Nuxt.js静态站生成器SSR 完全指南https://cn.vuejs.org/v2/guide/ssr.html在 2.3 发布后我们发布了一份完 ...
- vue-nuxt.js部署到宝塔主机服务器
废话不多说,直接上步骤,如下: 本文章为在 vue环境下使用了nuxt.js 1.搭建环境--由于本人安装的是宝塔主机,因此如下: 由于我直接使用的是宝塔主机,直接去“软件管理”安装 PM2管理器. ...
随机推荐
- 栈 VS 队列
linkStack.javalinkQueue.java程序强调栈和队列是概念上的实体,独立于它们的具体实现.用数组或者是用链表实现栈都是一样的.栈的重要性在于它的push()操作和pop()操作.以 ...
- Python datetime与timestamp之间的转换
# !!!! Python 2 datetime.datetime 对象没有timestamp方法! 在用Python处理datetime和timestamp的转换时发现在时区方面,Python的处理 ...
- POJ.2175.Evacuation Plan(消圈)
POJ \(Description\) \(n\)个建筑物,每个建筑物里有\(a_i\)个人:\(m\)个避难所,每个避难所可以容纳\(b_i\)个人. 给出每个建筑物及避难所的坐标,任意两点间的距离 ...
- 洛谷P1880 石子合并(区间DP)(环形DP)
To 洛谷.1880 石子合并 题目描述 在一个园形操场的四周摆放N堆石子,现要将石子有次序地合并成一堆.规定每次只能选相邻的2堆合并成新的一堆,并将新的一堆的石子数,记为该次合并的得分. 试设计出1 ...
- Python发送QQ邮件
#!/usr/bin/python # -*- coding: UTF-8 -*- import smtplib from email.mime.text import MIMEText fro ...
- 潭州课堂25班:Ph201805201 django 项目 第三十三课 后台文章标签查询提交到前台,删除功能实现(课堂笔记)
在视图中创建个类,要实现此功能,并把结果返回前台 , from django.shortcuts import render from django.views import View from dj ...
- Linux引导程序类型
Bootloader Monitor 描述 X86 ARM PowerPC LILO 否 Linux磁盘引导程序 是 否 否 GRUB 否 GNU的LILO替代程序 是 否 否 Loadlim 否 从 ...
- HDU5518 : John's Fences
求出平面图的对偶图,那么需要选择一些环,使得这些环可以异或出所有环. 对于两个不同的区域,需要用一个代价最小的环把它们区分开,这对应最小割. 那么求出对偶图的最小割树,所有树边之和就是把所有区域都区分 ...
- 编程菜鸟的日记-初学尝试编程-寻找2到n之间的素数并输出
//输入一个整数n,输出2到n之间的具体素数值 #include <iostream> #include <algorithm> #include <cmath> ...
- xpath分析 html文件抽正文的过程
使用Py3的HTMLParser解析模块解析HTML的时候,出现:no moudle named 'markupbase' 错误. 用xpath打算分析html里面的新闻.根据运行程序后的报错的信息, ...