AntDesign去国际化 | router页面显示问题

news/2024/7/7 19:40:07

删除 Ant Design Pro 中的【国际化】模块报错:Environment key “es2022“ is unknown

问题描述

使用 npm run i18n-remove 运行 “i18n-remove”: “pro i18n-remove --locale=zh-CN --write” 删除【国际化】模块时出现如下报错:

在这里插入图片描述

问题分析

报错的大致意思是,在 \node_modules@umijs\lint\dist\config\eslint\index.js 文件中找不到 es2022 这个环境配置的关键字。

解决方案
该配置和我们删除【国际化】模块关系不大,所以我采取的方式是进入 \node_modules@umijs\lint\dist\config\eslint\index.js 文件中,注释掉 es2022 属性,再次运行 npm run i18n-remove 完美解决。

在这里插入图片描述

再次运行npm run i18n-remove ,发现又报如下错误:

<color='red> Error: Failed to load plugin ‘unicorn’ declared in ‘BaseConfig’: Cannot find module ‘eslint-plugin-unicorn’

查官网发现,给出了相应的解决方案 ,缺依赖包,需要加上以下依赖包:

npm i @typescript-eslint/eslint-plugin
npm i eslint-plugin-eslint-comments
npm i eslint-plugin-jest
npm i eslint-plugin-unicorn

再次运行npm run i18n-remove ,发现【国际化】模块和其他模块的依赖关系解除成功。
运行 npm run start 查看前端项目是否可以正常启动,发现左侧菜单栏消失了,在官网搜索,找到了 解决方案 ,做如下修改:
将 config 模块的 route.js 配置文件的每一条路由都加上对应的 name 属性,如下:

export default [
  { name: '登录', path: '/user', layout: false, routes: [{ path: '/user/login', component: './User/Login' }] },
  { name: '欢迎页面', path: '/welcome', icon: 'smile', component: './Welcome' },
  {
    path: '/admin',
    icon: 'crown',
    access: 'canAdmin',
    name: '管理员页面',
    routes: [
      { path: '/admin', redirect: '/admin/sub-page' },
      { path: '/admin/sub-page', component: './Admin' },
    ],
  },
  { icon: 'table', path: '/list', component: './TableList', name: '表格页' },
  { path: '/', redirect: '/welcome' },
  { path: '*', layout: false, component: './404' },
];

再次刷新前端项目,结果就显示出来了,完美解决。

注意事项

运行命令 npm run i18n-remove 删除后,需要手动删除 src/locales 包。

官网可解决的问题
如下的报错,可以进 Ant Design Pro 官网提供的 GitHub 官网连接找到答案:

在这里插入图片描述

上面的报错,运行如下命令即可解决:

npm i --save-dev prettier eslint-config-prettier eslint-plugin-prettier

注意:这个 BUG 应该会出现在上一个 BUG 之前,新的 nodejs 版本(>= v16.13.0)在删除国际化模块时,会出现这个问题.


http://lihuaxi.xjx100.cn/news/1863249.html

相关文章

【论文解读:EXPLANING AND HARNESSING ADVERSARIAL EXAMPLES】

论文解读&#xff1a;EXPLANING AND HARNESSING ADVERSARIAL EXAMPLES 摘要引言相关工作对抗样本的线性解释非线性模型的线性扰动线性模型的对抗训练VS权重衰减深度网络的对抗训练不同模型的能力为什么对抗样本具有泛化性&#xff1f;可能的假设总结和讨论 摘要 许多机器学习模…

初试占比7成!只考一门数据结构+学硕复录比1:1的神仙学校,大连交通大学考情分析

大连工业大学 考研难度&#xff08;☆&#xff09; 内容&#xff1a;23考情概况&#xff08;拟录取和复试分析&#xff09;、院校概况、24专业目录、23复试详情、各专业考情分析、各科目考情分析。 正文1014字&#xff0c;预计阅读&#xff1a;3分钟 2023考情概况 大连工业…

InsCode实践分享:一款强大的Web代码编辑器

InsCode是一款基于Web的代码编辑器&#xff0c;它提供了丰富的功能和便捷的操作界面&#xff0c;可以满足程序员在编写、调试和分享代码方面的各种需求。本文将从以下几个方面介绍InsCode的实践分享&#xff1a;使用体验、主要功能、扩展应用、团队协作和未来发展。 一、使用体…

信息化系列——企业信息化建设(2)

企业信息化建设常见问题 1、信息化意识薄弱 目前&#xff0c;仍有许多企业的管理者在信息化方面表现出薄弱的认识&#xff0c;他们对信息化建设的重视程度显得捉襟见肘。结果&#xff0c;企业在信息化建设的人力、物力支持方面投入甚微&#xff0c;导致信息化建设难以完成顶层…

上机实验四 哈希表设计 西安石油大学数据结构

实验名称&#xff1a;哈希表设计 &#xff08;1&#xff09;实验目的&#xff1a;掌握哈希表的设计方法及其冲突解决方法。 &#xff08;2&#xff09;主要内容&#xff1a; 已知一个含有10个学生信息的数据表&#xff0c;关键字为学生“姓名”的拼音&#xff0c;给出此表的一…

一天一个设计模式---生成器模式

概念 生成器模式&#xff08;Builder Pattern&#xff09;是一种创建型设计模式&#xff0c;用于构建复杂对象。它允许您逐步构造一个对象&#xff0c;将构建过程与最终对象的表示分离开来。这种模式通常用于创建复杂的对象&#xff0c;这些对象可能有多个部分组成&#xff0c…

深入理解强化学习——马尔可夫决策过程:蒙特卡洛方法-[代码实现]

分类目录&#xff1a;《深入理解强化学习》总目录 在文章《深入理解强化学习——马尔可夫决策过程&#xff1a;蒙特卡洛方法-[基础知识]》中我们介绍了利用蒙特卡洛方法计算马尔可夫决策过程价值的方法&#xff0c;本文将用代码定义一个采样函数。采样函数需要遵守状态转移矩阵…

代码随想录二刷 |字符串|总结篇

代码随想录二刷 &#xff5c;字符串&#xff5c;总结篇 什么是字符串双指针法翻转KMP 什么是字符串 字符串是若干字符组成的有限序列&#xff0c;也可以理解为是一个字符数组&#xff0c;C提供一个string类&#xff0c;string类会提供 size 接口&#xff0c;可以用来判断 stri…