手把手教你使用宝塔部署Vue项目
更新时间：2023年08月14日 08:40:13 作者：喜闻乐见天
这篇文章主要给大家介绍了关于如何使用宝塔部署Vue项目的相关资料,宝塔面板提供了非常方便的方式来部署 Vue 项目,文中通过图文介绍的非常详细,需要的朋友可以参考下
1. Vue项目执行打包命令进行打包得到dist文件夹
npm run build
2. 打开宝塔主页进入网站，选择添加站点
3. 将自己的服务器网址作为域名，默认为80端口，可自行设置备注和根目录，点击提交
4. 点击设置->配置文件，加入如下代码（配置跨域问题），点击保存（建议手敲，格式很重要）
location /api {
proxy_pass http://gmall-h5-api.atguigu.cn;
}
5. 点击文件，进入前面设置的地址，将原有文件全部删除
6. 将前面打包的dist文件夹里面的文件拖到宝塔文件中，进行上传
7. 进入nginx文件夹下的conf文件夹，找到nginx.conf文件，双击进入编辑，找到server下的listen，将端口改为前面设置的端口，保存即可（需要部署多个项目时复制多个server进行配置）
8. 输入前面设置的域名即可进入制作的项目中
总结
到此这篇关于使用宝塔部署Vue项目的文章就介绍到这了,更多相关宝塔部署Vue项目内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
您可能感兴趣的文章:
相关文章
vue使用js-file-download插件下载文件乱码的解决
这篇文章主要介绍了vue使用js-file-download插件下载文件乱码的解决,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-07-07
这篇文章主要介绍了vue 内联样式style中的background用法说明，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-08-08
ref 和 reactive都是vue3推出的针对组合式设计的声明响应式状态的API,两者在使用之前都要先进行引入,本文通过实例代码详解vue3中的ref、reactive问题,感兴趣的朋友一起看看吧2024-03-03
本篇文章主要介绍了vue中vuex的应用（入门教程），详细的介绍了vuex.js和应用方法，有兴趣的可以了解一下2017-09-09
今天小编就为大家分享一篇Vue实现push数组并删除的例子，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要为大家介绍了vue基于electron构建第一个程序过程详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-01-01
关于vue 结合原生js 解决echarts resize问题
这篇文章主要介绍了关于vue 结合原生js 解决echarts resize问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
vue v-for出来的列表,点击某个li使得当前被点击的li字体变红操作
这篇文章主要介绍了vue v-for出来的列表,点击某个li使得当前被点击的li字体变红操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
这篇文章主要为大家详细介绍了Vue3如何利用vuedraggable实现动态配置页面,文中的示例代码讲解详细,具有一定的借鉴价值,需要的可以参考一下2023-12-12
这篇文章主要介绍了vue中向data添加新属性的三种方式小结，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
最新评论