1、首先可以通过finallshell这个软件连上自己的服务器
2、配置nginx安装所需的环境
yum install gcc-c++
yum install -y pcre pcre-devel
yum install -y zlib zlib-devel
yum install -y openssl openssl-devel
3、下载linux版本的Nginx,我下的是Nginx 1.16.1版本的
链接:https://nginx.org/en/download.html
4、将刚才下载的压缩包上传到linux服务器上
cd /usr/src我是在/usr下的src目录下创建一个Nginx文件夹,然后把刚才的压缩包上传到这个文件夹下(直接右键上传)
解压这个压缩包,解压的命令是
tar -zxvf nginx-1.16.1.tar.gz (换个版本号)
5、安装Nginx
上步解压安装包后,cd进入解压后的文件,先输入./config 然后再输入命令 make&&make install ,进行编译和安装
6、查看是否安装成功,启动Nginx
一般是默认安装在 /usr/local/nginx目录下的,而我们启动进入这个目录下的sbin文件,执行脚本的
1、进入 nginx 安装目录下的sbin目录
命令:cd /usr/local/nginx/sbin (默认 /usr/local/nginx/sbin)
2、启动nginx
命令: ./nginx
3、查看 nginx 进程:
命令: ps -ef | grep nginx
4、浏览器输入:127.0.0.1就可以打开nginx的默认首页了(也可以输入自己服务器的ip地址,也能打开,端口号在config文件中)
5、关闭nginx
命令: ./nginx -s stop 此时127.0.0.1界面就是无法访问了
6、重启nginx
命令: ./nginx -s reload
注意:上面这些命令都是要在 /usr/local/nginx/sbin 这个目录中执行的
7、打包vue项目
打包命令:npm run build 会生成一个dist文件夹
注意:vue项目打包的时候,是不会把vue.config文件给打包进去的,也就是说打包后的vue项目中配置的代理是不起作用了
(需要在nginx上配置跨域,做法也就是把vue.config中的配置代理的那些步骤,复制一份到nginx的配置文件中,但是需要略作修改)
8、上传dist文件夹中的两个文件
把打包的dist文件夹上传到服务器上的nginx中,此时上传的地方是 /usr/local/html 目录下,而在这个目录下是已经存在一个
index.html文件了,这个文件就是刚才访问127.0.0.1时看到的界面,现在这两个文件删掉,把打包的dist文件中的index.html和
static文件夹上传到此处
注意:这是在不修改nginx默认访问文件是index.html的情况下可以这么做,一般情况也不会动这个配置项的
9、修改nginx配置,转发代理
进入 cd /usr/local/nginx/conf 目录可修改nginx的配置文件:
http可以包含多个http服务,一个server配置一个独立的站点。
一个http可以有多个server,一个server可以有多个location匹配资源路径
相关链接:
https://blog.csdn.net/weixin_42585386/article/details/122215776
https://blog.csdn.net/weixin_36755535/article/details/110185316
https://blog.csdn.net/zzddada/article/details/110928669
https://blog.csdn.net/qq_46323758/article/details/116351553
https://segmentfault.com/a/1190000038672615 ---配置多个vue项目
https://blog.csdn.net/ksrtyl/article/details/107084866
https://blog.csdn.net/JKjiang123/article/details/103064819?spm=1001.2014.3001.5501
https://cloud.tencent.com/developer/article/1654844
https://blog.csdn.net/qq_25460159/article/details/116225163 nginx下载安装
https://blog.csdn.net/qq_25460159/article/details/112947177?spm=1001.2014.3001.5501 使用nginx部署多个前端项目(三种方式)
https://blog.csdn.net/qq_29678299/article/details/107160509?spm=1001.2014.3001.5501
nginx部署多个vue项目的2种方法
nohup java -jar jar包名 &
ps -ef |grep java
kill 端口号
lsof -n / |grep deleted 查看已删除空间却没有释放的进程
在替换新jar包的时候,先杀死旧的进程,然后再替换,不然就会造成旧jar包的进程一直在运行,这种就相当于是删除了快捷方式,而真正的程序并没有被删掉
如果nginx启动时提示没有nginx.pid,可以先杀死nginx进程,重新启动看看
ps -ef |grep nginx
kill 端口号
如果nginx配置改乱了,在nginx的config目录下还有个nginx.confg.default文件,这是默认备份的最初始的配置文件,只需要改个名字就能能用了(改名前需要再备份一下)
1、想要同时配置多个前端项目,做法就是多写几个server,server中换一个端口监听,转发依旧是location来配置转发,
(因为前后端都是部署在一个服务器上的,所以转发地址就是服务器的地址了),
2、location / {
// root html // 在nginx的安装目录下有个html文件夹,这个就代表是根目录,打包的文件就放在这个文件夹中,
// 假设部署了两个前端项目,都同时放在html文件夹中的话,比如一个项目是one,一个是two,那么里面该这么写
root html/two // 因为是两个项目,所以在另一个server中的配置中 这么写:root html/one
index index.html index.htm; // 这个默认就行,表示前端页面从这个文件开始访问
}
usr/local/nginx/sbin
传输文件
scp dist.zip 10.128.13.62:8000/usr/local/nginx/html
新增:
假设配置文件中的listen:5000
意思就是监听5000端口,即网页访问的端口是5000
http:///www.localhost:5000.com
http:www.127.0.0.1:5000.com
就是网页访问的端口号,网页默认的端口号是80,如果没有改默认的端口号,怎可以忽略不写
nginx中可以写多个server,监听多个网页
nginx配置中的http属性中可以配置 转发的数据量上限
http{
client_max_body_size 1024m
}
nginx配置中被注释的一行 user 可以配置指定用户访问nginx
worker_processes 1;
user nginx nginx; # 指定Nginx服务的用户和用户组
https://blog.csdn.net/guo_qiangqiang/article/details/107592269