怎么把用vue写的前后台项目打包上传到服务器让其能访问

1.把前后台项目npm run build进行打包成distF（前台），distB（后台）的文件进行压缩,放在桌面

2. 打开终端,找到左上角的新建远程连接

3. 登陆成功后将压缩包上传到服务器/usr/local/nginx/html文件夹下(这一步首先得安装aginx，安装地址：https://blog.csdn.net/weixin_45463061/article/details/126414260?spm=1001.2014.3001.5502)

put '压缩包的路径' /usr/local/nginx/html
put /Users/tangyican/Desktop/distB.zip /usr/local/nginx/html
put /Users/tangyican/Desktop/distF.zip /usr/local/nginx/html

4. 进入到云服务器/usr/local/nginx/html文件夹下，删除原来的50x.html和index.html文件

rm -rf 50x.html index.html

unizp distF.zip
yum install -y unzip zip

5. 进入到distF的文件夹下面,将文件夹下的所有文件移动到/usr/local/nginx/html目录下面，并返回html目录删除distF文件夹和distF压缩包

mv css/ img/ index.html js/ /usr/local/nginx/html

6. 解压后台压缩文件distB.zip，创建admin文件夹

unzip distB.zip

mkdir admin

6. 进入到distB文件里，将所有文件移到到/usr/local/nginx/html/admin文件夹下，删掉压缩包和原来的文件

mv favicon.ico index.html static/ /usr/local/nginx/html/admin

7. 完成以上步骤，访问公网地址，应该就能够访问到了（http://139.159.221.143/是前台地址，http://139.159.221.143/admin是后台地址）

8. 在第七步可以看到，可以访问网站了，但是请求不到接口。这时候需要配置nginx代理（类似于在本地配置的vue.config.js做代理），修改/usr/local/nginx/conf/nginx.conf文件，双击进去修改就可以了。

location / {root   html;index  index.html index.htm;try_files $uri $uri/ /index.html;}location /api {proxy_pass http://127.0.0.1:3001;
}location /res {proxy_pass http://127.0.0.1:3001;
}location /static {proxy_pass http://127.0.0.1:3001;
}

9. 第8步修改了配置文件并保存完后，需要重启nginx服务。进入/usr/local/nginx/sbin目录下输入重启命令进行重启。

./nginx -s reload

10. 第9步完成后，再次访问http://139.159.221.143/admin后台地址和前台地址，便可以成功访问。

至此，大功告成~

怎么把用vue写的前后台项目打包上传到服务器让其能访问相关推荐

如何将写好的网页放到服务器上,写好的网页怎么上传云服务器
写好的网页怎么上传云服务器内容精选换一换在本地主机和Windows云服务器上分别安装QQ.exe等工具进行数据传输.使用远程桌面连接mstsc方式进行数据传输.该方式不支持断点续传,可能存在传输 ...
uni-app实现支付及项目打包上传
本文主要介绍uni-app项目中如何实现支付功能(支付宝支付.微信支付),及项目如何打包上传. 一.实现支付前置工作,项目要实现支付功能,首先要在根目录manifest.json文件内App模块配置 ...
vue项目路径修改及打包上传到服务器
1.项目路径修改默认项目路径是localhost:8080,如果要配置位相对路径,需要在config/index.js文件的 assetsPublicPath配置为 ./ 2.项目打包用命令行工具 ...
Springboot 项目打包上传到私服 Nexus3，如何通过私服下载自己上传的jar包，Nexus3的搭建和使用（二）
上一篇写了私服的搭建和登录后的界面介绍,这一篇具体写一下私服的使用,如何通过私服下载工程依赖,如何上传自己项目为其他工程项目引用. 一,如何通过私服下载项目工程依赖下面的图是登录之后的界面,主要是第 ...
zx-quill+vue+element实现富文本图片上传到服务器
quill富文本编辑器图片默认是base64数据流,我们要实现把图片上传到服务器这个需求,quill中并没有找到相关配置 https://www.jianshu.com/p/9e4e4d955d0f ...
SSM项目/SpringBoot项目/SpringBoot+Vue前后端分离项目图片上传并查看功能实现汇总
SSM项目下的图片上传: 1.前端Js代码:用户点击"上传头像"按钮后,会执行uploadPhoto()的方法. <button type="button" ...
【转】vue项目打包上传的步骤和方法
vue项目实现github在线预览功能 Vue项目上传github并预览 vue项目上传Github预览
springboot 打包_springboot项目打包上传至阿里云服务器
工具 IDEA+Xshell6+maven 详细步骤 01 对Spring Boot项目进行打包打包的两种方式:IDEA和CMD 首先介绍使用IDEA进行打包. 双击clean和package,ID ...
git上传新项目到服务器_springboot项目打包上传至阿里云服务器
工具 IDEA+Xshell6+maven 详细步骤 01 对Spring Boot项目进行打包打包的两种方式:IDEA和CMD 首先介绍使用IDEA进行打包. 双击clean和package,ID ...

怎么把用vue写的前后台项目打包上传到服务器让其能访问

1.把前后台项目npm run build进行打包成distF（前台），distB（后台）的文件进行压缩,放在桌面

2. 打开终端,找到左上角的新建远程连接

3. 登陆成功后将压缩包上传到服务器/usr/local/nginx/html文件夹下(这一步首先得安装aginx，安装地址：https://blog.csdn.net/weixin_45463061/article/details/126414260?spm=1001.2014.3001.5502)

4. 进入到云服务器/usr/local/nginx/html文件夹下，删除原来的50x.html和index.html文件

5. 进入到distF的文件夹下面,将文件夹下的所有文件移动到/usr/local/nginx/html目录下面，并返回html目录删除distF文件夹和distF压缩包

6. 解压后台压缩文件distB.zip，创建admin文件夹

6. 进入到distB文件里，将所有文件移到到/usr/local/nginx/html/admin文件夹下，删掉压缩包和原来的文件

7. 完成以上步骤，访问公网地址，应该就能够访问到了（http://139.159.221.143/是前台地址，http://139.159.221.143/admin是后台地址）

8. 在第七步可以看到，可以访问网站了，但是请求不到接口。这时候需要配置nginx代理（类似于在本地配置的vue.config.js做代理），修改/usr/local/nginx/conf/nginx.conf文件，双击进去修改就可以了。

9. 第8步修改了配置文件并保存完后，需要重启nginx服务。进入/usr/local/nginx/sbin目录下输入重启命令进行重启。

10. 第9步完成后，再次访问http://139.159.221.143/admin后台地址和前台地址，便可以成功访问。

怎么把用vue写的前后台项目打包上传到服务器让其能访问相关推荐

最新文章

热门文章

怎么把用vue写的前后台项目打包上传到服务器让其能访问

1.把前后台项目npm run build进行打包成distF（前台），distB（后台）的文件进行压缩,放在桌面

2. 打开终端,找到左上角的新建远程连接

3. 登陆成功后 将压缩包上传到服务器/usr/local/nginx/html文件夹下(这一步首先得安装aginx，安装地址：https://blog.csdn.net/weixin_45463061/article/details/126414260?spm=1001.2014.3001.5502)

4. 进入到云服务器/usr/local/nginx/html文件夹下，删除原来的50x.html和index.html文件

5. 进入到distF的文件夹下面,将文件夹下的所有文件移动到/usr/local/nginx/html目录下面，并返回html目录删除distF文件夹和distF压缩包

6. 解压后台压缩文件distB.zip，创建admin文件夹

6. 进入到distB文件里，将所有文件移到到/usr/local/nginx/html/admin文件夹下，删掉压缩包和原来的文件

7. 完成以上步骤，访问公网地址，应该就能够访问到了（http://139.159.221.143/是前台地址，http://139.159.221.143/admin是后台地址）

8. 在第七步可以看到，可以访问网站了，但是请求不到接口。这时候需要配置nginx代理（类似于在本地配置的vue.config.js做代理），修改/usr/local/nginx/conf/nginx.conf文件，双击进去修改就可以了。

9. 第8步修改了配置文件并保存完后，需要重启nginx服务。进入/usr/local/nginx/sbin目录下输入重启命令进行重启。

10. 第9步完成后，再次访问http://139.159.221.143/admin后台地址和前台地址，便可以成功访问。

怎么把用vue写的前后台项目打包上传到服务器让其能访问相关推荐

最新文章

热门文章

3. 登陆成功后将压缩包上传到服务器/usr/local/nginx/html文件夹下(这一步首先得安装aginx，安装地址：https://blog.csdn.net/weixin_45463061/article/details/126414260?spm=1001.2014.3001.5502)