【若依ruoyi Vue前端线上个人服务器部署】以及常见报错问题解决
提示:【若依ruoyi Vue前端线上个人服务器部署】以及常见报错问题解决
文章目录
- 前言
- 一、若依ruoyi Vue前端部署常见两种错误
- 1、404问题
- 2、找不到….模块
- 二、使用步骤(正式开始)
- 1.修改vue.config.js中的publicPath属性。
- 2.修改router/index.js,添加一行base属性。
- 3.给路径添加,防止每次跳转找不到其路径。
- 1、修改layout/components/Navbar.vue中的location.href
- 2、修改utils/request.js中的location.href
- 4、在尾端,添加 resolve
- 5、打包
- 6、把默认的dist包,放到自己的服务器上面。
- 7、Nginx配置(重要!!)
- 8、访问
- 总结
前言
【若依ruoyi Vue前端线上个人服务器部署】以及常见报错问题解决,跟着下面我的步骤,你会少采很多坑。
一、若依ruoyi Vue前端部署常见两种错误
下面遇到的问题,后面我们都会解决!!!
1、404问题
刷新主页、或者退出登录状态,都会报404问题。
2、找不到….模块
点击左侧的导航栏,点不动,控制台报错:
若依框架vue部署找不到模块(Error: Cannot find module ‘@/‘)
二、使用步骤(正式开始)
下面以: https://www.ruoyi.com/admin,为例,去讲解,按照下面流程修改。
1.修改vue.config.js中的publicPath属性。
"/" 修改为 "/admin/"
这个是指定子路径,不然找不到。
2.修改router/index.js,添加一行base属性。
原先没有这个属性,添加上去。(这一个非常重要!!!)
前缀。
3.给路径添加,防止每次跳转找不到其路径。
1、修改layout/components/Navbar.vue中的location.href
在前面添加/admin
2、修改utils/request.js中的location.href
在前面添加/admin
4、在尾端,添加 resolve
这一步解决的就是:“点击左侧的导航栏,点不动,控制台报错:若依框架vue部署找不到模块(Error: Cannot find module ‘@/‘)” 解决的就是这个问题!!!
OK!!!,到这一步,全部完成!!!下面去打包!!!
5、打包
输入指令:npm run build:prod
6、把默认的dist包,放到自己的服务器上面。
7、Nginx配置(重要!!)
下面的配置路径,注意和上面要去对应!!!
重启Nginx服务器,即可完成访问!!!
8、访问
然后就可以输入域名,访问线上若依系统。
OK!!!到这里就实现,把若依前端部署在自己的服务器上面,若依的后端,利用Docker部署简单,这里就不展示了!
总结
按照上面步骤,你就能实现需求,对应部分解决的什么,已经在上面展示。