Vue项目的打包
在你的Vue项目中运行以下命令
|
|
或者是在webstorm的package.json运行build
运行之后生成dist文件夹,并对其进行压缩
项目在宝塔面板部署
新建网页
1、登录宝塔面板并新建网站
2、输入域名,例如自己域名或IP地址,可使用默认端口,如不输入端口则使用默认80端口
注意:要在腾讯云中防火墙放行相应端口
3、选择网页内容目录如使用默认的地址可不更改如图所示并点击提交
上传打包文件
1、如图所示并上传压缩包,将压缩包上传到上述选择的目录中
2、右键将其解压,在检查确定解压完整性后将其压缩包删除
访问网站
在地址栏输入自己的IP地址即可访问网站,如自定义端口号,则后面需添加冒号后输入端口号
踩坑记录
自定义端口号
1、除非特殊情况,要不然使用默认80端口,因为浏览器对端口号进行限制
一、问题复现
使用自定义105端口对网页进行打开并ERR_UNSAFE_PORT报错
二、解决方案
1、更换端口 2、改变浏览器安全设置
Google Chrome浏览器 关闭浏览器->桌面找到浏览器图标->点击右键选择属性->在【目标】后追加空格+–explicitly-allowed-ports=10080(见下面配置)->点击【保存】->双击图标,重新打开浏览器。
|
|
Edge浏览器
搜索栏中输入regedit,回车打开系统注册表,进入计算机\HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Edge\ExplicitlyAllowedNetworkPorts,此路径不一定存在,可自行创建。然后在 ExplicitlyAllowedNetworkPorts 新建一个名称为 1 的字符串值,修改其值为10080。最后重启浏览器,访问端口为10080的地址。
三、部分非安全端口列表
|
|
感谢:知乎https://zhuanlan.zhihu.com/p/383077079文章参考
...