vue2项目写完后上市的步骤

本文介绍了如何在VSCode中使用npmrunbuild打包Vue项目,包括配置productionSourceMap以优化文件结构。还涵盖了服务器购买(如阿里云、腾讯云)、安全组设置、Xshell登录以及使用Xftp传输文件,最后是通过Nginx实现反向代理以连接本地项目和服务器的部署步骤。
摘要由CSDN通过智能技术生成

1.打包上限

1.1.在vscode中的打包:npm run build

1.2.打包前要注意,要在vue.config.js文件中配置productionSourceMap:false 417111a69cc84921a4c4ad7167de5d76.jpg

 配置后,相当处理了Map文件,文件更加整洁如下图0dd39980892740da953cd2b1c852b1b9.jpg

 没在vue.config.js文件中配置productionSourceMap:false 则如下图b4be5958375541029c5189930dfac47d.jpg

 2.购买服务器

2.1如阿里云 、腾讯云256868a24fa94ab299b13849a183aa20.jpg

 8b2b5dd8321f410881cfe4aac8fc571e.jpg

2.2搜索 安全组(服务器端口对外开放)6f1b95aab1ea4c95a073b44a2bd7c1c7.jpg

 2.3利用Xshell 登录自己买的服务器

b5cdb38b705346ef87e8ae7cdd013f45.jpg

cc17086b833b452896872b6f1c94d641.jpg

48563d86891b4c6d912e7c7453000562.jpg 

 2.3向远程服务器传文件  Xftp

2.3.1要登录

1d360a1b30994014a633ae5d536035cc.jpg

 70f02e54b43842ab870d811a2ef4cf32.jpg

3.2.的反向代理(通过nginx,让自己买的服务器,与项目本地vue.config.js中服务器进行连接,成而让自己的服务器进行浏览)

3.1.nginx的配置

1.通过xshell进入根目录 /etccdf279275b76491aaee7cb6eeb796c75.jpg

 2 .        819543b98ecc44a0929632eab4f95b73.jpg

95852a14c0284d28ad44f8cba43bddfd.jpg

78e6582ecc854272ba88a16653a4c2e8.jpg1f5eece70c8d4415b6755a7c422077b4.jpg 

 

 

 

 

 

 

 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值