NUXT搭配pm2部署上线

7 篇文章 0 订阅
本文详细介绍了如何使用PM2管理Nuxt.js项目,包括项目打包、指定配置、上传文件、安装PM2、启动与停止项目、设置开机自启动等步骤。此外,还讲解了如何配合Nginx进行反向代理配置,实现通过域名访问Nuxt服务,并列举了PM2常用命令,帮助开发者更好地管理和部署Node.js应用。
摘要由CSDN通过智能技术生成

一. 项目打包,指定配置文件package.json

# 在package.json
"config": {
    "nuxt": {
      "host": "0.0.0.0",
      "port": "3000"
    }  
}

#或nuxt.config.js上加上
server:{
    port:3000, //default:3000
    host: '0.0.0.0',  //default:localhost
}
# 项目打包 npm run build

2.上传文件到服务器,注意是这些文件,6个

在这里插入图片描述

3.下载依赖,和前台运行

npm install

npm run start

二.PM2环境的安装

npm install -g pm2

在这里插入图片描述
测试安装成功

pm2 list

开机自启动
pm2 startup
pm2 save

在这里插入图片描述

进入项目文件夹后用pm2启动项目,

pm2 start --name "NUXT项目名" -- run start

停止项目

pm2 stop guli-front

pm2一些相关命令

pm2 start npm --name "项目名" -- run start

pm2 start app.js -i 4 #后台运行pm2,启动4个app.js
                              # 也可以把'max' 参数传递给 start
                              # 正确的进程数目依赖于Cpu的核心数目
pm2 start app.js --name my-api # 命名进程
pm2 list               # 显示所有进程状态
pm2 monit              # 监视所有进程
pm2 logs               #  显示所有进程日志
pm2 stop all           # 停止所有进程
pm2 restart all        # 重启所有进程
pm2 reload all         # 0秒停机重载进程 (用于 NETWORKED 进程)
pm2 stop 0             # 停止指定的进程
pm2 restart 0          # 重启指定的进程
pm2 startup            # 产生 init 脚本 保持进程活着
pm2 web                # 运行健壮的 computer API endpoint (http://localhost:9615)
pm2 delete 0           # 杀死指定的进程
pm2 delete all         # 杀死全部进程

三. 如果实在是找不到 :pm2: command not found 修改软连接

#我这里是
ln -sf /usr/local/node-v12.18.0/bin/pm2  /usr/local/bin/ 
或者
ln -sf /usr/local/node-v12.18.0/bin/pm2  /usr/local/bin/pm2

mv /usr/local/bin/pm2 /tmp/ 删除就好,再次执行上一步

在这里插入图片描述
在这里插入图片描述

搭配nginx的使用

项目已经启动,npm run start —> http://localhost:8657

基础的目录是:
在这里插入图片描述
目的是通过域名访问到nuxt服务(此处测试的域名为www.wfaceboss.top),修改nginx安装目录/conf/nginx.conf中的server配置,查看配置文件位置:

grep --color=auto nginx

nginx -c /etc/nginx/nginx.conf

在这里插入图片描述
修改nginx配置文件

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;
events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    upstream nodenuxt {
            server 127.0.0.1:3000; # nuxt 项目监听PC端端口
            keepalive 64;
        }

    server {
        listen       81;
        server_name  www.wfaceboss.top;####这里要填写域名

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
     proxy_pass http://nodenuxt;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }


    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    #server {
    #    listen       443 ssl;
    #    server_name  localhost;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_key  cert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout  5m;

    #    ssl_ciphers  HIGH:!aNULL:!MD5;
    #    ssl_prefer_server_ciphers  on;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}

}

nginx 命令

nginx -s reload //重新载入nginx(当配置信息发生修改时)

nginx -s quit //停止ngix 

之后就是PM2启动,pm2启动nuxt项目,

注意:xxx是项目名称,即package.json中的name

pm2 start /node_modules/nuxt/bin/nuxt.js --name 项目名称             (项目目录的node_modules包)

在这里插入图片描述

在这里插入图片描述

pm2其他命令

pm2 list                             # 列表 PM2 启动的所有的应用程序
pm2 show 0                           #查看进程详细信息,0为PM2进程id 
pm2 stop all                         #停止PM2列表中所有的进程
pm2 stop 0                           #停止PM2列表中进程为0的进程
pm2 reload all                       #重载PM2列表中所有的进程
pm2 reload 0                         #重载PM2列表中进程为0的进程
pm2 delete 0                         #删除PM2列表中进程为0的进程
pm2 delete all                       #删除PM2列表中所有的进程

pm2 start app.js              # 启动app.js应用程序
pm2 start app.js -i 4         # cluster mode 模式启动4个app.js的应用实例
                              # 4个应用程序会自动进行负载均衡
pm2 start app.js --name="api" # 启动应用程序并命名为 "api"
pm2 start app.js --watch      # 当文件变化时自动重启应用
pm2 start script.sh           # 启动 bash 脚本

pm2 monit                     # 显示每个应用程序的CPU和内存占用情况
pm2 show [app-name]           # 显示应用程序的所有信息
pm2 logs                      # 显示所有应用程序的日志
pm2 logs [app-name]           # 显示指定应用程序的日志
pm2 flush                     # 清空所有日志文件
pm2 restart all               # 重启所有应用
pm2 reload all                # 重启 cluster mode下的所有应用
pm2 gracefulReload all        # Graceful reload all apps in cluster mode
pm2 scale api 10              # 把名字叫api的应用扩展到10个实例
pm2 reset [app-name]          # 重置重启数量
pm2 startup                   # 创建开机自启动命令
pm2 save                      # 保存当前应用列表
pm2 resurrect                 # 重新加载保存的应用列表
pm2 update                    # Save processes, kill PM2 and restore processes
pm2 generate                  # Generate a sample json configuration file

未完待续…

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值