umi
cvory
这个作者很懒,什么都没留下…
展开
-
React项目指定项目启动的Host域名(UMI版本),指定域名与指定端口号报错
我有一篇写的指定Host域名:https://blog.csdn.net/qq_40593656/article/details/120745490项目代理配置:我在项目中指定了端口号80,启动项目时,指定了host域名在本地的host配置里,对于在这个域名后面加了端口号:xxxx.com:80以上就是我的bug复现背景,此时我跑项目无法启动Bug原因一般域名是默认的80端口,如果项目本身就指定了80端口号,端口号会被冲突占用, 可以试试,把端口号改成其他,就可以启动项目。本地的ho原创 2021-12-22 15:21:52 · 2198 阅读 · 0 评论 -
Web启动项目走Https协议(Webpack版,Umi版和Host代理版)
需求Web项目的启动,一般是默认的http协议,在某些业务需求时,需要走https来调试Webpack版本只需在webpack的devServer中配置就可以了 devServer: { host: '0.0.0.0', port: 8080, https: true, // 加入这句即可 }Umi脚手架版本官方文档介绍:https://umijs.org/zh-CN/docs/env-variables#httpspackage.json添加一条命令Host代理版有一原创 2021-10-13 15:57:04 · 2110 阅读 · 0 评论 -
打包报错 umi: command not found
首先,需要安装Node.js (一路下一步安装),并确保 node 版本是 8.10 或以上使用 yarn 管理 npm 依赖然后全局安装 umi,并确保版本是 2.0.0 或以上$ yarn global add umi$ umi -v2.0.0出现'umi' 不是内部或外部命令,也不是可运行的程序 或批处理文件或者提示 umi: command not found# mac系统$ sudo vi ~/.bash_profile# 在 .bash_profile中添加下..原创 2021-10-12 11:58:25 · 4545 阅读 · 0 评论 -
Umi-request 创建多个request文件,但拦截器相互污染
需求业务上的需要,request的配置上区别很大,所以建了两个request请求文件,对应的接口调用对应的request问题在两个文件的拦截器中log,会发现发起一个请求,两个拦截器都有进入Code两个文件不好演示,使用放在一个文件,建两个实例 const http1 = extend(); const http2 = extend(); const responseInterceptor = response => { console.log('hello world');原创 2021-10-11 10:53:44 · 1287 阅读 · 0 评论 -
UmiJS+React 配置不同环境变量(配置UMI_ENV)
需求给项目配置不同环境,然后在项目里,可以通过这个环境来动态处理一下逻辑,或者后台服务地址Code在package.json里,写不同环境的启动命令行和build命令行"start:dev": "cross-env UMI_ENV=dev umi dev","start:test": "cross-env UMI_ENV=test MOCK=none umi dev","start:pre": "cross-env UMI_ENV=prod umi dev","build:test原创 2021-10-09 18:07:43 · 5980 阅读 · 0 评论 -
UmiJs+React 配置项目启动端口号
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar原创 2021-10-09 16:19:20 · 1091 阅读 · 0 评论 -
使用umi脚手架搭建项目后,页签一直显示 ant design Pro,且页面搜索无结果
问题描述使用umi脚手架搭建项目后,页签一直显示 ant design Pro,且页面搜索无结果脚手架安装命令yarn create umi myapp解决方案config文件夹下defaultSettings.js配置中没有配置title属性出现原因在生成页签时,如果未配置title属性,默认显示ant design Pro,这也是为什么全局搜索后无结果。但是如果不想要带页签,可以将设置 title:''...原创 2021-09-03 16:21:06 · 669 阅读 · 1 评论 -
@umijs/runtime“ does not exist in container
问题复现操作1.使用umi脚手架搭建项目yarn create umi myapp2.将里面的插件,layout等配置进行清理后,安装插件以及启动项目yarn installnpm run start3.将当前项目作为模板,除开node_modules ,复制为另一个项目,安装插件后启动就会出现'@umijs/runtime" does not exist in container'的问题解决方案删除src 下 .umi 文件原因.umi是临时文件夹,但是它是匹配当前项目插件的版本原创 2021-09-03 16:01:55 · 6506 阅读 · 5 评论 -
React Hooks 父页面 调用子组件方法
需求在父页面中调用子组件中的方法运用的ApiuseRef,useCallback,useImperativeHandle父页面:对组件进行ref赋值组件使用useImperativeHandle把需要对父组件暴露的方法包起来在组件内,对这个方法的使用和其他方法没有区别父组件的调用...原创 2021-06-30 17:51:01 · 510 阅读 · 0 评论 -
React+Umi 的H5 小程序公用跳转 H5小程序路由带参
场景分析使用H5编写小程序的原因:公众号和小程序的页面重复,避免同一页面写两次。可从网页进入,也可从小程序进入跳转方法分析工具使用端的分为 小程序内页面跳转和 普通网页页面跳转小程序内的页面跳转会分为:a>关闭本页打开b>不关闭本页打开(普通跳转)c>跳转tab页d>跳转外链e>回跳网页跳转:外链跳转,普通项目内跳转Code// 公用跳转处理 modelName:页面路由,query:参数, type:跳转方式export const na原创 2021-06-30 15:57:21 · 1324 阅读 · 0 评论 -
umi项目动态设置页面title (H5编写小程序动态设置头部)
解决方案UMI中有Helmet这个插件API ,专门用来自定义页面头部写在HEAD中的都可以写在这里面:meta , link 等原创 2021-06-29 18:13:14 · 3922 阅读 · 0 评论 -
umi 添加新的文件类型识别 添加loader(以gltf文件为例)
需求项目中需要用到gltf格式文件需要添加loader解决方案项目是 React + Umi + Antd在config文件中对chainWebpack进行赋值url-loader 插件需要额外安装原创 2021-06-29 17:33:10 · 2023 阅读 · 0 评论 -
npm run build报错:UnhandledPromiseRejectionWarning: TypeError: pathToFileURL is not a function
问题描述前端框架为react+umi打包时报错:UnhandledPromiseRejectionWarning: TypeError: pathToFileURL is not a function然后报错找不到所有的css文件查遍了最近的修改,发现是umi生了版本,然后css-loader报错解决方案:将umi回退到之前的版本,重新安装打包即可...原创 2021-03-22 18:06:34 · 1535 阅读 · 0 评论 -
Umi + AntDesign Pro 自定义路由图标(阿里矢量图标库)
需求 :菜单栏显示自定义的图标流程:1.在阿里巴巴矢量图官网 建一个自己项目!!!这里的前缀 一定一定要写icon-就是因为这里的配置,所以我之前一直都没弄出来!2.上传完自己的图片后,引用把这里的js路径 配置到basiclayout里3.使用路由的icon,就直接写你在阿里巴巴矢量图里的命名就可以显示了!此方法仅针对prolayout组件!https://prolayout.ant.design/api#api...原创 2020-12-29 09:57:59 · 6471 阅读 · 0 评论 -
react+umi项目打包成electron桌面应用
项目介绍web项目使用的是 React+Umi+Antd使用的是umi的脚手架创建项目 yarn create @umijs/umi-app链接:umi官网流程1.将web项目打包成静态文件后2.在打包后的文件 再用electron打包成桌面应用(所以其实是用什么框架或者脚手架,都没有什么关系,最后electron需要的是可直接在浏览器访问的静态文件=》npm run build 以后生成的index.html)Coding将项目进行打包,使用命令行 npm run build原创 2020-10-19 16:00:18 · 2740 阅读 · 4 评论 -
react+umi npm run build打包后的静态文件无法本地打开显示白屏
web 项目是使用的react框架,然后由umi的脚手架创建的yarn create @umijs/umi-app需求:打包后的文件需要本地可在浏览器打开原理原本打包后的文件 是在服务器中访问,静态文件中的方案在config中配置路径相关的属性实测好用...原创 2020-10-19 11:34:38 · 5822 阅读 · 2 评论