【已解决】若依系统前端打包后,部署在nginx上,点击菜单错误:@/views/system/role/index

上面错误,是因为@/views/system/role/index动态路由按需加载时候,错误导致。

解决办法:

如果您的前端项目访问时候,需要带有项目名称的话,参考凯哥上一篇文章:【已解决】若依前后端分离版本,前端项目Nginx部署时候怎么带上应用路径?

先把该修改的都修改后,在来解决这个问题。

凯哥的解决方案如下:

一、将项目中的node_modules 文件夹删除

然后重新

复制代码
# 安装依赖
npm install
# 建议不要直接使用 cnpm 安装依赖,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npmmirror.com

二、修改babel.config.js文件

将现有的都注释掉,替换成下面的:

复制代码
module.exports = {
  presets: [
    // https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
    // '@vue/cli-plugin-babel/preset'
    '@vue/babel-preset-jsx',
    [ '@babel/preset-env',
      {
        'useBuiltIns': 'entry',
        'corejs': 3
      }]
  ],

  'env': {
    'development': {
      // babel-plugin-dynamic-import-node plugin only does one thing by converting all import() to require().
      // This plugin can significantly increase the speed of hot updates, when you have a large number of pages.
      'plugins': ['dynamic-import-node']
    },
  }
}

三、在对应的环境配置文件中添加。凯哥现在使用的是

npm run build:prod 命令构建的。这是生产环境的。所以,凯哥就修改.env.production配置文件,添加如下两句:

复制代码
BABEL_ENV = production
NODE_ENV = production

配置完成之后,重新安装执行

复制代码
# 构建生产环境
npm run build:prod

将重新生成的dist文件夹放到nginx上面,然后重新访问。登录,点击菜单就正常了。

如果还是不可以的话,参考:动态路由按需加载-Cannot find module · Issue #I4PZJF · 若依/RuoYi-Vue - Gitee.com

相关推荐
开开心心就好4 小时前
批量提取PDF中的图片,直接导出原图
前端·javascript·支持向量机·智能手机·pdf·html·启发式算法
骇客野人6 小时前
Redis 完整安装部署方案(Linux,分【源码编译】+【Docker】两种,推荐生产用源码,测试快速用 Docker)
运维
Setsuna_F_Seiei7 小时前
前端转型 Agent 开发 05 之 Agent Hooks 与 Checkpointer(让 Agent 从全自动转变人为可掌控)
前端·agent·ai编程
百万蹄蹄向前冲9 小时前
风扇转了一晚上MVP专家团翻车事故
前端·人工智能
默_笙9 小时前
🏛 给 AI 配一间办公室:Harness Engineering 六大模块与它的实现
前端·javascript
蓝速科技9 小时前
会议室门牌公告通知发布选型与落地指南丨蓝速科技
大数据·运维·数据库·人工智能·科技
chicheese10 小时前
Linux 面试速查表:从初级到高级,附高频场景答题模板
linux·运维
linux_cfan10 小时前
videojs v10 源代码系列解读:14 · 谓词守卫:在运行时安全地调用能力
前端·javascript·音视频
Linux-lucky10 小时前
32-38-Linux学习之旅之MySQL综合
linux·运维·学习·mysql·ubuntu
kyriewen10 小时前
我扒了 10,221 条 JD:腾讯技术岗 75% 在要 AI
前端·人工智能·ai编程