ant design pro v5踩坑

最新推荐文章于 2024-07-02 09:27:50 发布
原创 最新推荐文章于 2024-07-02 09:27:50 发布 · 1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#node.js #git #ant

本文档记录了在使用AntDesignProV5时遇到的启动问题及解决方案。在安装并启动项目后，可能出现`@umijs/runtime`不存在的错误，这可能由mfsu导致。解决办法是删除`src`下的`.umi`文件以清除缓存，然后重新启动项目，即可消除错误。详细步骤和背景信息可在给出的博客链接中查看。

ant design pro v5踩坑

下载项目

需要本地有git、node环境，node版本不能太低，这里使用的是node 12.14.0，笔者使用的是js版本
如果不想下载也可以私信笔者。

踩坑

第一次install成功，启动没问题，但是报错很多，可能有如下错误。

myapp/node_modules/@umijs/runtime" does not exist in container.while loading

解决方案：

可能是由于项目启动时候用到了mfsu，导致的问题，可以采用删除src下的.umi文件来删除缓存，然后重新启动，项目就不报错了
在启动时候出现这个

文档详见：https://blog.youkuaiyun.com/weixin_44134588/article/details/119386818

精选资源
ant-design-pro-V5-multitab:基于 ant design pro V5 版本实现多标签切换 基于umi插件 umi-plugin-keep-alive 实现 （目前只支持layout
05-25
ant-design-pro-V5-multitab 基于 ant design pro V5 版本实现多标签切换 基于umi插件 umi-plugin-keep-alive 实现 （目前只支持layout: "side"模式， fixedHeader: true,）
精选资源
ant design pro动态菜单
03-30
在Ant Design Pro中实现动态菜单是一项常见的需求，尤其是在构建企业级后台管理系统时。Ant Design Pro是一个基于Ant Design和React的高级UI框架，它提供了一系列组件和解决方案，帮助开发者快速搭建和定制后台应用...
node_modules/@umijs/runtime" does not exist in container.
牛奔的博客
08-16 2492
使用 umi 脚手架搭建项目，启动时报错 node_modules/@umijs/runtime" does not exist in container. 出现问题 .umi 是临时文件夹，但是它是匹配当前项目插件的版本，以及一些对应的 theme 配置，layout 配置，如果项目直接复制过来在兼容版本上，可能会造成一定的匹配问题 解决方案 删除 src 下 .umi 文件 ...
Ant Design Pro (七) 新增了组件引用之后界面转圈圈
听我一言的博客
09-24 1652
由于引用了新的模块到界面中, 发现引用之后界面开始出现转圈圈了, 解决方法就是删除pages/.umi 目录，重新运行 原因分析可能是模块冲突了， 具体说明如下 UmiJS目录说明 src/pages/.umi 这是 umi dev 时生产的临时目录，默认包含 umi.js 和 router.js，有些插件也会在这里生成一些其他临时文件。可以在这里做一些验证，但请不要直接在这里修改代码，umi 重启或者 pages 下的文件修改都会重新生成这个文件夹下的文件。 ...
@umijs/runtime“ does not exist in container
Cvory
09-03 7060
问题复现操作 1.使用umi脚手架搭建项目 yarn create umi myapp 2.将里面的插件，layout等配置进行清理后，安装插件以及启动项目 yarn install npm run start 3.将当前项目作为模板，除开node_modules ，复制为另一个项目，安装插件后启动就会出现'@umijs/runtime" does not exist in container'的问题 解决方案 删除src 下 .umi 文件 原因 .umi是临时文件夹，但是它是匹配当前项目插件的版本
ant design pro v5
yuzheh521的博客
07-24 2222
就是删除这个文件 ./src/components/index.md，我建的项目是 simple，删了之后直接可以运行。目前已经试过删除node_modules文件夹，并重新安装依赖包，依旧报错。### 问题出现的环境背景及自己尝试过哪些方法。Ant Design Pro版本：5.2.0。
解决安装ant design vue遇到的版本问题
qq_42458917的博客
04-04 397
【代码】解决安装ant design vue遇到的版本问题。
精选资源
ant design4.40 web组件库 ant design pro后台模板库（精细-完整）
12-26
Ant Design 是基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。 ant design4.40-web组件库 是基于Axure ，参考Ant Design 的样式而设计的一套模板库，是产品经理必备套件库，Ant Design...
Ant Design Pro 下实现文件下载的实现代码
10-15
在Ant Design Pro框架下实现文件下载功能，是前端开发者在开发过程中常遇到的需求。本文将详细介绍如何在Ant Design Pro中实现文件下载功能，涉及到的关键知识点包括如何使用Ajax发送请求，如何处理响应数据，以及...
精选资源
AXURE Ant Design 4.40 - web组件库 ant design pro 后台模板 产品经理
02-13
标题中的“AXURE Ant Design 4.40 - web组件库 ant design pro 后台模板 产品经理”指的是一款基于Axure设计工具的组件库，它整合了Ant Design Pro的4.40版本的Web界面元素和后台管理模板，特别适用于产品经理进行...
FAQ: antd pro/umi 添加区块错误
01-08
虽然按照antd pro/umi官网构建的项目， 执行添加模块操作时： $ umi block add EmptyPage 或 $ umi block add https://github.com/umijs/umi-blocks/tree/master/demo 报出异常类似： × error AssertionError [ERR_ASSERTION]: C:\Users\用户名\.umi\blocks\github.com\umijs\umi-blocks\EmptyPage don't exists 解决方法： 到官方下载所有模块。 解压添加到C:\Users\用户名.u
node_modules/@umijs/runtime“ does not exist in container.
luckywuxn的博客
07-02 615
近日，在做pro ant react 项目时，遇到了如下这样的错误，开始通过vs code 的通义灵码折腾了一阵子，后面在csdn上一搜索，马上就找到答案了，特记录一下，后面再遇到这样的问题也就有迹可循了。
node_modules/@umijs/runtime does not exist in container
weixin_45060105的博客
03-04 2864
问题 ./D:/wonderdown/xdr-1/xdr/wonder-xdr/node_modules/@umijs/runtime ‘@umijs/runtime" does not exist in container’ 问题出现原因： 从gothub上下载了一个新的项目，webstorm 同时打开两个项目，且两个项目的 umijs/runtime的版本不一致 解决方案 删除src 下 .umi 文件 原因 .umi是临时文件夹，但是它是匹配当前项目插件的版本，以及一些对应的theme配置，la
Umi配置
qq_33715850的博客
02-17 1842
Umi配置
修改ant design pro项目名称后，报错“...文件” does not exist in container
做点有意思的事情
11-18 340
解决办法
umi 安装新的依赖之后报错Uncaught (in promise) Error: Module “./axios“ does not exist in container.
KioSas的博客
04-26 566
2.删除src里边的.umi文件夹删除了重新安装就好了，因为.umi文件夹是存储的缓存,需要再一次更新。1.检查是否正确安装axios（或者package.json中存在）
umi踩坑之旅 从入门到放弃
zwldqp的博客
05-18 2267
公司发展新业务 一个人从零开始建设。对比之后为了节约搭框架的时间和精力。我选择了dva。但是由于没有使用过，所以最开始没有选择umi配合。出来混，迟早是要还的。在遇到我想在request里面使用state的时候，我遇到了项目的第一个坑？百度的解决方法是从window.g_app里拿。解决方法之统一。让我不得不考虑umi。于是，我第一次重构了我的项目。 全局安装umi之后init项目。然后！！！！当我辛辛苦苦把代码挪过来之后发现window下面依旧没有g_app。去百度找发现没有结果。感觉就是所有人的wi.
npm使用问题汇总
热门推荐
lonelymanontheway的博客
03-15 1万+
基本命令 package.json解析 版本格式 npm ERR! code EINTEGRITY Verfication failed while extracting 删除node_modules文件夹 npm ERR! Windows_NT 6.1.7601 call config.load() before reading values
umi或antdpro运行时报错“Module ‘xxx‘ does not exist in container“解决方案
GMLGDJ的博客
03-10 1万+
问题描述 在我们启动基于umi的脚手架,如antd pro,在运行完毕后控制台报如下错误： Error: Module "本地的路径信息" does not exist in container. 原因:可能是因为项目路径移动后导致src/.umi缓存文件找不到原来的路径所导致的 问题解决 方案一： 删除src/.umi然后重新运行项目就解决了 方案二： 关闭mfsu功能，在config/config.ts中找到mfsu并删除该属性。 ...
根据Ant Design Pro V5生成欢迎页面
最新发布
11-19
Ant Design Pro V5是一个基于Ant Design设计体系的企业级后台开发框架，它提供了快速搭建高可用、高性能后台应用的功能。如果你想生成一个欢迎页面，可以按照以下步骤操作： 1. **安装依赖**: 首先确保已经全局安装了`npm`或`yarn`。然后，在项目目录下运行： ```bash npm install @ant-design/pro-layout @ant-design/icons antd pro-components ``` 2. **创建布局文件**: 在`src`目录下的`pages`文件夹下创建一个名为`Login`或`Home`的文件夹，用于存放欢迎页组件。创建一个名为`Index.js`的文件，并引入必要的组件库： ```jsx import { Layout, Menu } from &#39;@ant-design/pro-layout&#39;; import { Welcome } from &#39;@/components/Welcome&#39;; // 假设Welcome组件在components文件夹内 const AppLayout = () => { return ( <Layout> {/* 导航栏 */} <Menu theme="dark" mode="horizontal"> {/* 添加菜单项 */} </Menu> {/* 欢迎页面内容 */} <div style={{ height: &#39;calc(100vh - 64px)&#39; }}> <Welcome /> </div> </Layout> ); }; export default AppLayout; ``` 3. **编写欢迎页面组件**: 创建`Welcome.js`文件，编写自定义欢迎页面内容，比如显示一些提示信息和图片等： ```jsx import React from &#39;react&#39;; const Welcome = () => { return ( <div className="welcome-page"> {/* 样式和文案可以根据需要定制 */} <h1>欢迎使用 Ant Design Pro V5</h1> <img src="/path/to/welcome-image.png" alt="Welcome Image" /> {/* 引入你的欢迎图 */} </div> ); }; export default Welcome; ``` 4. **配置路由**: 如果使用的是Ant Design Pro提供的默认路由管理，你需要在`router.config.js`或相应的配置文件中添加`/login`或`/home`的路由映射。 记得替换上述示例中的路径和组件名称为实际项目中的内容。完成以上步骤后，你应该就能看到一个基于Ant Design Pro V5的欢迎页面了。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值