众所周知，vue主要是用于开发单页应用的，在网上，也可以通过修改配置文件，实现多页面应用的开发，通过配置方式的开发多页面会有较多的缺点，在网上有许多论述，在此不再多言。此篇文章主要讲的是vue多页面的项目在nginx上部署，实现前后端分离，后台通过webapi和ajax的方式获取数据的方式。
1、 首先需要做的是在服务器上安装nginx服务器，个人使用的是Ubuntu20.4版本，这个网上的教程较多，不做过多介绍。
2、修改nginx的配置文件，在安装完成之后，输入nginx -v查看nginx服务的版本，如下图：

然后cd到/etc/nginx/sites-enabled路径下面，可以看到一个default文件，该文件就是需要我们修改的文件，建议先备份之后再修改。输入nano default,正常情况下可以看到如下截图内容：

而需要修改的配置如下截图的内容：

其中root /home/chuan/Web;和 index index.html index.htm index.nginx-debian.html;
表示的是访问该服务器ip之后的目录，如访问127.0.0.1，此时服务器会到root对应的目录下去返回index标识的文件，例如我们需要在访问服务器的ip时能够在浏览器中展示首页的内容，此时我们就可以将vue做好的首页应用放到root所对应的路径下面。如下图：

其中的index.html和static就是首页应用在通过vue编译打包之后的文件。此时如果我们还需要添加更多的界面该怎么做？如上面第三张图，在图中可以看到如下字样：

location /login{alias /home/chuan/Web/Login;}location /main{alias /home/chuan/Web/Main;}

其实该内容就是配置其他页面的访问路径，比如第一个location就是如果该项目vue编译好的登录页面的存放位置，此处注意alias关键字的使用。第二个location就是项目的主页的vue放置的路径。如下截图：

在配置好之后，ctl+s保存文件，再ctl+x退出。
此处提醒一下需要注意的是，在vue项目编译的时候，需要修改一下配置文件config/index.js文件中的assetPublicPath的值，修改之前是“/”,需要修改成“./”也就是将根目录修改成当前目录，如下截图：
将编译好之后的dist文件中的static文件夹以及index.html通过某些方式上传到刚才nginx设置的路径下面，然后重启注意文件夹的权限。在将相关的文件放到对应的路径下面之后，输入命令：sudo nginx -s reload，并输入systemctl restart nginx重启nginx服务。然后通过浏览器访问服务器的ip地址，即可访问到设置为root路径
的vue项目：如下截图：


至于前端与后台的交互内容，后续再跟进写出来吧。。。。。。