博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
nuxt.js部署vue应用到服务端过程
阅读量:6589 次
发布时间:2019-06-24

本文共 1142 字,大约阅读时间需要 3 分钟。

由于seo的需要,最近将项目移植道nuxt.js下采用ssr渲染

移植完成后,一路顺畅,但是到了要部署到服务器端上时候,还是个头疼的问题,但最终还是顺利完成。

现在记录一下部署中的过程。

注:部署时候过程中,参考了下:

一:搭建nginx+node+npm+pm2环境

我们的nginx版本是 1.12

node版本是v8.11.1
npm版本是5.6.0
pm2版本是2.10.2

具体环境安装,网上都有教程,就不在叙述,直接进入正文。

一:配置nginx代理监听3002端口,package打包时端口3002

在nuxt.js的项目下package.json里设置

图片描述

在nginx的 vhost里新建一个主机绑定

upstream nodenuxt {    server 127.0.0.1:3002; #nuxt项目 监听端口    keepalive 64;}server {    listen 80;    server_name mysite.com;    location / {        proxy_http_version 1.1;        proxy_set_header Upgrade $http_upgrade;          proxy_set_header Connection "upgrade";        proxy_set_header Host $host;        proxy_set_header X-Nginx-Proxy true;        proxy_cache_bypass $http_upgrade;        proxy_pass http://nodenuxt; #反向代理    }}

二:项目在本地完成后,npm run build 打包应用

打包完成后,我们将

.nuxtstaticnuxt.config.jspackage.json

传到服务器空间里, 需要上传文件如下

图片描述

三:在服务器上部署运行

  1. 运行npm install 安装package里的依赖
  2. 运行npm start 就可以运行起来nuxt的服务渲染了

此时我们就可以在浏览器上输入 mysite.com 访问了。服务端渲染瞬间出来了,但这并不理想,进程稳定性能否常驻后台?

四:pm2开启进程守护

进入对应的应用目录,执行以下命令

pm2 start npm --name "my-nuxt" -- run start

其中 my-nuxt的名称是 我们在package中的项目名称。

执行完pm2的启动命令后,我们用 pm2 list 查看一下进程列表,我截一下我个人服务器的pm2列表:
图片描述

大功完成,今晚吃鸡去。

转载地址:http://erkio.baihongyu.com/

你可能感兴趣的文章
mysql主从同步和读写分离
查看>>
jconsole监控linux系统的jvm使用
查看>>
网络安全设计、配置与管理大全
查看>>
check outlook mailbox size
查看>>
什么是 stack?- 每天5分钟玩转 Docker 容器技术(111)
查看>>
java 泛型编程(一)
查看>>
Dell PowerEdge R940解析:四路顶配服务器维护平民化
查看>>
《数据重现》赠书活动开始
查看>>
Android 中文 API (93) —— BaseExpandableListAdapter
查看>>
PowerShell中单引号和双引号的区别
查看>>
【ARM】gpio·arm体系结构之gpio
查看>>
数据库启动时遇到ORA-01578错误
查看>>
Fedora 12 (Constantine)Beta版及Alpha镜像下载
查看>>
稳扎稳打Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox
查看>>
Who's Using Cyberthreat Intelligence and How?
查看>>
【翻译】SQL Server索引进阶:第六级,标签
查看>>
确定两串乱序同构
查看>>
寒假研究计划
查看>>
Android:ListView、BaseAdapter、convertView、ListView优化及事件、notifyDataSetChanged()
查看>>
新版发布功能上线,新增「大屏快照」功能!
查看>>