Linux部署web网站（前后端分离）

持续关注我，我将分享一个网站完整的搭建过程！

前言

最近刚购买了一台阿里云的服务器准备要搭建一个网站，正好将网站的一个完整搭建过程分享给大家！前面我们已经把一个web网站的环境都给搭建好了，现在正式开始部署web网站！

项目介绍

这里我们以litemall项目为例子，项目地址：github.com/linlinjava/… 搭建一个经典的电商网站，其中包括三个模块：轻商场VUE前端，管理后台VUE前端，Springboot后端。我们以轻商场举例，来介绍如何搭建。

一、部署VUE前端

首先我们需要在本地安装好nodejs，npm环境，然后我们下载litemall项目，进入litemall-vue前端项目目录，执行以下命令

npm install --registry=https://registry.npmmirror.com

npm run build:prod

这样会得到一个dist文件夹，我们需要将它上传到服务器上。

我们将dist文件放在自己用户下面的，这里我是root用户，我就创建litemall目录，在litemall目录下面，创建放至前端的文件夹，litemall-vue。

#创建放至轻商场前端文件的目录
mkdir -p /root/litemall/litemall-vue

将我们之前打包的前端文件，上传到相应的目录下,并解压

二、部署后端文件

我们将打包的后端文件，上传到服务器的litemall-wx-api目录下。

#创建litemall-wx-api目录
mkdir -p /root/litemall/litemall-wx-api

将jar文件上传到此目录下

启动jar

nohup java -jar litemall-wx-api-0.1.0-exec.jar  &

三、配置nginx文件

修改nginx的配置，我们监听80端口，设置默认首页为前端首页，

 server {
        listen       80;


        location / {
                    #此处修改为你的前端文件地址
                    root   /root/litemall/litemall-vue/dist;
                    index  index.html index.htm;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

    }

服务器防火墙开放你后端服务的端口

然后检查一下，配置文件是否有错误，到nginx的sbin目录下执行./nginx -t ,确认无问题后，重启nginx,这样我们在次输入服务器的ip,就能直接访问到我们的页面了

四、总结

今天web网站的搭建到这里就结束了，大家主要多去了解nginx的配置文件的各个部分的含义。如果有什么问题大家可以留言或者私信我！我都会尽力跟大家解决！下次我们将配置域名来访问我们的网站！