nginx配置vue项目500_一个Nginx部署多个vue前端项目总结

摘要:

近来接手了一个二次开发的前后端分离模式的项目,其中在前端项目的部署上需要让2个前端项目都部署到一个IP地址和端口下,那么我们这里就要用到Nginx了,接下来我们看看如何在一个Nginx下部署2个前端项目的

编译打包2个前端项目

执行如下命令执行对前端工程的打包,以生成静态文件,如下:

npm run build

把打包生成的静态文件上传到Linux服务器的指定目录,我这里是:/usr/local/lawyer_wsla/frontend/dist

7d818add820573277473547e59be7cea.png

同上,把另一个前端工程也执行打包命令,以生成静态文件,如下:

把打包生成的静态文件上传到Linux服务器的指定目录,我这里是:/usr/local/lawyer_wsla/frontend/zjwsla

ddbcde0394863108accb6fd023ac4a49.png

配置Nginx.conf文件

efe00bb41b5fff585a8d609380613b6c.png
#user  nobody;
user root;
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;server {listen       80;server_name  localhost;#charset koi8-r;#access_log  logs/host.access.log  main;location / {root  /usr/local/lawyer_wsla/frontend/dist;try_files $uri $uri/ @router;index  index.html index.htm;}location /zjwsla {alias /usr/local/lawyer_wsla/frontend/zjwsla;try_files $uri $uri/ /zjwsla/index.html;index  index.html index.htm;}location @router {rewrite ^.*$ /index.html last;}#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服务

cd /usr/local/nginx/sbin./nginx -s reload

访问项目

b703c94f1b3e705bb8be0a447a7945d6.png

745ded665d4367d8caf116bb14b6a0da.png

遇到的问题

暂无

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/337461.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vaadin_Vaadin和DukeScript中的Hello World

vaadin从表面上看 , Vaadin和GWT通常与DukeScript有很多共同点。 两者都致力于为Java开发人员提供面向浏览器的解决方案,并且由于其对Maven的原生支持,因此与IDE集成良好。 但是,这些方面实际上是它们共有的全部。 从编程模型到框…

【C语言】指针进阶第三站,数组指针!

点击蓝字关注我们数组指针整型指针:指向整型的指针字符指针:指向字符的指针数组指针:指向数组的指针基本概念下面哪个是数组指针呢?指针数组和数组指针的概念很容易混淆,一定要分清楚哦!int *p1[10]; int (…

Python3判断是否为回文数

Python3判断是否为回文数原题 https://leetcode-cn.com/problems/palindrome-number/ 题目: 不允许用str的方法! 判断一个整数是否是回文数。回文数是指正序(从左向右)和倒序(从右向左)读都是一样的整数。…

lambda 序列化_如何以及为什么要序列化Lambda

lambda 序列化总览 lambda序列化在许多用例中很有用,例如持久配置或作为远程资源的访客模式 。 远程访客 例如,因此我想访问远程Map上的资源,可以使用get / put,但是说我只想从Map的值中返回一个字段,我可以将lambda作…

python进行数据查询_如何进行python数据库查询?(实例解析)

在这篇文章之中我们来了解一下关于python数据库的相关知识,有些朋友可能是刚刚接触到python这一编程语言,对这一方面不是特别的了解,在接下来这篇文章将会来带大家来了解关于python查询数据库中数据的相关知识。 数据库的查询操作 Python查询…

【C语言】指针进阶第四站:数组/指针的传参问题!

点击蓝字关注我们朋友们,到站啦!指针进阶第四站:传参问题0.引例自定义函数里形参的类型,要和函数调用中传过去的实参类型相对应test函数里的是int类型,我们传过去的参数a也是int类型void test(int n) {} int main() {i…

python做自动化控制postman_python自动化测试入门篇-postman

接口测试基础-postman 常用的接口有两种:webservice接口和http api接口。 Webservice接口是走soap协议通过http传输,请求报文和返回报文都是xml格式。 http api接口是走http协议,通过路径来区分调用的方法,请求报文都是key-value形…

Python3实现红黑树[上篇]

Python3实现红黑树[上篇]由于时间有限,这次只写了红黑树添加节点,关于节点的删除放在下一讲 https://blog.csdn.net/qq_18138105/article/details/105324025。 关于红黑树的介绍,来由,性质和定义,可以看这篇文章&…

web应用程序并发测试_测试并发应用

web应用程序并发测试本文是我们名为Java Concurrency Essentials的学院课程的一部分。 在本课程中,您将深入探讨并发的魔力。 将向您介绍并发和并发代码的基础知识,并学习诸如原子性,同步和线程安全性的概念。 在这里查看 ! 目录…

深入理解存储器层次结构

点击蓝字关注我们1概述对于一个简单的计算机系统模型,我们可以将存储器系统看做是一个线性的字节数组,而 CPU 能够在一个常数时间内访问每个存储器的位置。实际上,存储器系统(memory system)是一个具有不同容量、成本和…

python中可选参数是什么意思_Python如何定义有可选参数的元类

问题 你想定义一个元类,允许类定义时提供可选参数,这样可以控制或配置类型的创建过程。 解决方案 在定义类的时候,Python允许我们使用 metaclass关键字参数来指定特定的元类。 例如使用抽象基类: from abc import ABCMeta, abstra…

C++的一个指针占内存几个字节?

C的一个指针占内存几个字节?结论: 取决于是64位编译模式还是32位编译模式(注意,和机器位数没有直接关系) 在64位编译模式下,指针的占用内存大小是8字节在32位编译模式下,指针占用内存大小是4字…

jmc线程转储_使线程转储智能化

jmc线程转储很久以前,我了解了一个称为Log MDC的东西,我对此非常感兴趣。 我突然意识到日志文件中发生的一切,并指出了特定的日志条目,并找到了对错,特别是在调试生产中的错误时。 2013年,我受委托从事一个…

【C语言】指针进阶第五站:函数指针!

点击蓝字关注我们函数指针函数也有自己的地址,函数名/&函数名 就是函数的地址1.1基本形式在 数组指针的学习中我们了解到int arr[5]; int (*pa)[5] &arr;//pa是数组指针指针变量pa的类型是int(*)[5]那么函数指针的形式是怎样的呢?void test(cha…

jsp 体检信息查询 绕过用户名验证_一篇彻底搞懂jsp

jsp 实栗 jsp jdbc 实现登录实现思路一个表单页,输入用户登录和密码,然后信息提交到jsp页面进行验证,如果可以服务器跳转到登录成功页,失败,跳转到错误页跳转的时候窗口的URL地址会发生变化代码如下编写登录代码登录&…

Python3求解找到小镇的法官问题

Python3求解找到小镇的法官问题原题 https://leetcode-cn.com/problems/find-the-town-judge/题目: 在一个小镇里,按从 1 到 N 标记了 N 个人。传言称,这些人中有一个是小镇上的秘密法官。 如果小镇的法官真的存在,那么&#xff…

couchbase_具有Rx-Java的Couchbase Java SDK

couchbase关于Couchbase Java SDK的一件整洁的事情是,它建立在出色的Rx-Java库的基础上,这为与Couchbase服务器实例进行交互提供了一种React性的方式,一旦掌握了它,它就非常直观。 考虑一个我打算存储在Couchbase中的非常简单的j…

C/C++与汇编混合编程有什么好处?

点击蓝字关注我们1 导语 当需要C/C与汇编混合编程时,可以有以下两种处理策略:若汇编代码较短,则可在C/C源文件中直接内嵌汇编语言实现混合编程。若汇编代码较长,可以单独写成汇编文件,最后以汇编文件的形式加入项目中&…

centos 7.6安装java_Hadoop的安装

为了方便后面使用Hadoop的shell命令,我先介绍Hadoop的安装。Hadoop有多种安装模式,这里介绍伪分布式的安装。我测试过Ubutun、Centos和WSL,都可以正常安装Hadoop的所有版本。所有一般不会出现版本对应的问题。Hadoop是基于Java语言进行编写的…

Python3 解题:字符串压缩

Python3 解题:字符串压缩原题 https://leetcode-cn.com/problems/compress-string-lcci/题目: 字符串压缩。利用字符重复出现的次数,编写一种方法,实现基本的字符串压缩功能。比如,字符串aabcccccaaa会变为a2b1c5a3。若…