Nuxt.js在centos7上的发布部署

本文涉及的产品
.cn 域名,1个 12个月
简介: Nuxt.js在centos7上的发布部署

前言


刚有个需求,开发个官网,涉及到SEO,但是vue开发的项目基本上是单页面应用,客户端渲染的,不利于搜索优化。 但是有成熟的SSR技术,也就是服务端渲染,本文使用Nuxt.js开发,部署和传统的vue部署略有区别。


源码微调


这个问题会出现,就是发布了后,服务器上可以访问,对外不能访问,需要对外暴露端口,设置 0.0.0.0 任何域名都可访问。

修改package.json文件,添加内容


//上面的不用动
  ,
  "config": {
    "nuxt": {
      "host": "0.0.0.0",
      "port": "3000"
    }
  }


1dc618a0ed9580ce8bfa6facb208c08f.png


build


在项目目录下执行


npm run build

5d4c6812c8535adbb050f4ddf2e1bce8.png


项目上传到centos服务器


复制文件和目录


.nuxt

assets (有的没有这个)

static

nuxt.config.js

package.json

46a9d80a6e05e4e3b19d57a0ee70bcdf.png

在项目部署目录下执行


1:【前提: centos上安装 node】


例如下载到/usr/local/src目录下


wget https://npm.taobao.org/mirrors/node/v14.13.1/node-v14.13.1-linux-x64.tar.xz

解压


# xz格式,先用xz解压
xz -d node-v14.13.1-linux-x64.tar.xz
# 再用tar解压
tar xvf node-v14.13.1-linux-x64.tar


设置环境变量


vim ~/.bashrc

在文件末尾添加内容并保存


export PATH=/usr/local/src/node-v14.13.1-linux-x64/bin:$PATH

使配置生效


source ~/.bashrc

查看安装版本


[root@master site]# node -v
v14.13.


2:【安装pm2】


npm stall -g pm2

pm2想了解更多的话,可以点击此处


2:【下载依赖】

在项目目录下执行


npm install

1dc618a0ed9580ce8bfa6facb208c08f.png


3:【使用pm2启动项目】

在项目目录下执行

pm2 start npm --name "boshi-web" -- run start

注意:boshi-web是给项目起的名字,命名随意,有空格的话,加双引号就可以了,不要使用单引号。加单引号的话,在使用“pm2 list”进行查看时,会看到项目进程的名字中也会带有单引号,但使用双引号就没问题。

5d4c6812c8535adbb050f4ddf2e1bce8.png


测试访问


http://服务器ip地址:3000

如:http://192.168.196.111:3000


nginx域名代理


方式1:


server {
        listen    80;
        server_name   域名地址;
        location / {
      proxy_pass http://ip:3000;
       }
   }


备注


ip可以使 服务器内网地址或外网地址,没用容器安装nginx也可以是127.0.0.1


方式2:


http {
  //其他代码略
    upstream 任意服务名A {
        # 这里指向宿主机中启动的官网服务
       server    ip:3000;
    }
   server {
        listen    80;
        server_name   你的域名地址;
        location / {
      proxy_pass http://任意服务名A ;
       }
   }    
}
相关文章
|
2月前
|
监控 前端开发 Linux
centos7系统安装部署zabbix5.0
【9月更文挑战第23天】在CentOS 7系统上部署Zabbix 5.0的步骤包括:安装MariaDB数据库及必要软件包,配置Zabbix仓库,设置数据库并导入Zabbix数据库架构,配置Zabbix服务器与前端参数,启动相关服务,并通过浏览器访问Web界面完成安装向导。
140 0
|
3月前
|
消息中间件 JavaScript 中间件
函数计算产品使用问题之WebIDE编写的Node.js代码是否会自动进行打包部署
函数计算产品作为一种事件驱动的全托管计算服务,让用户能够专注于业务逻辑的编写,而无需关心底层服务器的管理与运维。你可以有效地利用函数计算产品来支撑各类应用场景,从简单的数据处理到复杂的业务逻辑,实现快速、高效、低成本的云上部署与运维。以下是一些关于使用函数计算产品的合集和要点,帮助你更好地理解和应用这一服务。
|
3月前
|
资源调度 JavaScript Linux
【Azure 应用服务】本地Node.js部署上云(Azure App Service for Linux)遇到的三个问题解决之道
【Azure 应用服务】本地Node.js部署上云(Azure App Service for Linux)遇到的三个问题解决之道
|
7天前
|
资源调度 前端开发 JavaScript
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第10天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤,包括安装依赖、创建混淆脚本、修改 `package.json` 脚本命令、构建项目并执行混淆,以及在 HTML 文件中引用混淆后的文件。通过这些步骤,可以有效提高代码的安全性。
|
2月前
|
Oracle Java 关系型数据库
CentOS 7.6操作系统部署JDK实战案例
这篇文章介绍了在CentOS 7.6操作系统上通过多种方式部署JDK的详细步骤,包括使用yum安装openjdk、基于rpm包和二进制包安装Oracle JDK,并提供了配置环境变量的方法。
267 80
|
9天前
|
前端开发 JavaScript 安全
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第7天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤。包括项目准备、安装 `javascript-obfuscator`、配置 Vite 构建以应用混淆,以及最终构建项目进行混淆。通过这些步骤,可以有效提升前端代码的安全性,防止被他人轻易分析和盗用。
|
1月前
|
存储 Linux 开发者
虚拟机centos7.9一键部署docker
本文介绍了如何在 CentOS 7.9 虚拟机上安装 Docker 社区版 (Docker-ce-20.10.20)。通过使用阿里云镜像源,利用 `wget` 下载并配置 Docker-ce 的 YUM 仓库文件,然后通过 `yum` 命令完成安装。安装后,通过 `systemctl` 设置 Docker 开机自启并启动 Docker 服务。最后,使用 `docker version` 验证安装成功,并展示了客户端与服务器的版本信息。文中还提供了列出所有可用 Docker-ce 版本的命令。
175 0
虚拟机centos7.9一键部署docker
|
2月前
|
存储 Kubernetes 负载均衡
CentOS 7.9二进制部署K8S 1.28.3+集群实战
本文详细介绍了在CentOS 7.9上通过二进制方式部署Kubernetes 1.28.3+集群的全过程,包括环境准备、组件安装、证书生成、高可用配置以及网络插件部署等关键步骤。
411 3
CentOS 7.9二进制部署K8S 1.28.3+集群实战
|
2月前
|
Linux pouch 容器
CentOS7部署阿里巴巴开源的pouch容器管理工具实战
关于如何在CentOS 7.6操作系统上安装和使用阿里巴巴开源的Pouch容器管理工具的实战教程。
121 2
CentOS7部署阿里巴巴开源的pouch容器管理工具实战
|
2月前
|
Kubernetes Linux API
CentOS 7.6使用kubeadm部署k8s 1.17.2测试集群实战篇
该博客文章详细介绍了在CentOS 7.6操作系统上使用kubeadm工具部署kubernetes 1.17.2版本的测试集群的过程,包括主机环境准备、安装Docker、配置kubelet、初始化集群、添加节点、部署网络插件以及配置k8s node节点管理api server服务器。
119 0
CentOS 7.6使用kubeadm部署k8s 1.17.2测试集群实战篇