AntDesign(React)学习-1 创建环境
目录:
AntDesign(React)学习-15 组件定义、connect、interface
AntDesign(React)学习-14 使用UMI提供的antd模板
AntDesign(React)学习-13 Warning XX should not be prefixed with namespace XXX
AntDesign(React)学习-10 Dva 与后台数据交互
AntDesign(React)学习-9 Dva model reducer实践
AntDesign(React)学习-8 Menu使用 切换框架页内容页面
AntDesign(React)学习-5 路由及使用Layout布局
AntDesign(React)学习-4 登录页面提交数据简单实现
UMI不等同AntDesign(React),但是使用UMI可以减少一些配置工作量,下面笔记主要记录基于UMI环境学习,另外中间夹杂着一些基础技术。
关于UMI的说明引自百科:umi,中文可发音为乌米,是一个可插拔的企业级 react 应用框架。umi 以路由为基础的,支持类 next.js 的约定式路由,以及各种进阶的路由功能,并以此进行功能扩展,比如支持路由级的按需加载。然后配以完善的插件体系,覆盖从源码到构建产物的每个生命周期,支持各种功能扩展和业务需求,目前内外部加起来已有 50+ 的插件。umi 是蚂蚁金服的底层前端框架,已直接或间接地服务了 600+ 应用,包括 java、node、H5 无线、离线(Hybrid)应用、纯前端 assets 应用、CMS 应用等。
之前研究过一段时间AntDesign(Vue)版本的,感觉网上资料太少,BUG挺多,可能AntDesign(Vue)当时新出的问题比较多,最近要研究SpringBoot,借此机会从新点开React技术分支(从0开始)。后端SpingBoot学习
还是一步一步记录配置过程
1、安装umi

2、提示我node版本太低,去官网下载最新版本安装
http://nodejs.cn/download/
3、重新yarn create umi,一路回车
4、使用最新版本
windows下的 git的控制台有点乱码,使用windows cmd没有这个问题。
5、yarn install

6、提示一个错误
Error: EBUSY: resource busy or locked, symlink
关掉杀毒软件重试才成功
7、Building Refresh Packages一直停留
yarn.rc增加一条指令
puppeteer_skip_chromium_download true
或者
registry "https://registry.npm.taobao.org"
sass_binary_site "https://npm.taobao.org/mirrors/node-sass/"
phantomjs_cdnurl "http://cnpmjs.org/downloads"
electron_mirror "https://npm.taobao.org/mirrors/electron/"
sqlite3_binary_host_mirror "https://foxgis.oss-cn-shanghai.aliyuncs.com/"
profiler_binary_host_mirror "https://npm.taobao.org/mirrors/node-inspector/"
chromedriver_cdnurl "https://cdn.npm.taobao.org/dist/chromedriver"
8、yarn start 启动
可以进入项目进行一些配置
http://localhost:3000/configuration
运行效果如下,以后创建的项目统一使用TypeScript

AntDesign(React)学习-1 创建环境的更多相关文章
- AntDesign(React)学习-4 登录页面提交数据简单实现
github代码:https://github.com/zhaogaojian/jgdemo 全国肺炎,过节期间没地方去在家学习antd. 一.感觉antd pro项目太庞大了,可以学习下结构和代码风 ...
- AntDesign(React)学习-2 第一个页面
1.前面创建了第一个项目jgdemo,结构如下,使用TypeScript. 2.yarn start启动项目 3.点击GettingStarted是umi的官方网站 https://umijs.org ...
- AntDesign(React)学习-12 使用Table
AntDesign(Vue)版的Table中使用图片https://www.cnblogs.com/zhaogaojian/p/11119762.html 之前在使用VUE版Table时,使用大图片时 ...
- AntDesign(React)学习-9 Dva model reducer实践
今天肺炎增长数字依然吓人,感觉穿越到丧失片里了. 本节开始学习dva model使用,官网的讲解太文档化,对新手实践不太友好,自己简化了一个最简单的演示代码. 1.在src,models文件夹下创建u ...
- AntDesign(React)学习-5 路由及使用Layout布局
前言:学习目标实现点击登录按钮,直接进入后台布局页面,类似下面antd官网文档展示效果 ant.design访问 https://ant-design.gitee.io/components/menu ...
- AntDesign(React)学习-3 React基础
前面项目已经建起来了,但是没有React基础怎么办,从头学习,这个项目使用的是基于React16.X版本的几种技术集成,那么我们就从网上找一些相关的资料进行研究,我的习惯是用到哪学到哪. 一.先看一些 ...
- AntDesign(React)学习-10 Dva 与后台数据交互
明天正式在线办公没时间学习了,今天晚上再更新一篇, 代码提交一次:https://github.com/zhaogaojian/jgdemo 1.src下创建services目录 创建文件userSr ...
- AntDesign(React)学习-8 Menu使用 切换框架页内容页面
本节实现一个点击左侧menu在右侧content切换页面效果,原始代码请从UMI学习-6开始看 1.在pages下添加两个组件,User,UserRole import React from 'rea ...
- AntDesign(React)学习-15 组件定义、connect、interface
虽然常用的编码用一种即可,但是看别人文档或者示例时,有的写法不熟悉的话看着很不习惯,整理几种实现同一功能的不同写法 1.Dva Connect与@Connect import React, { Pro ...
随机推荐
- pycharm中新建Vue项目时没有vue.js的解决办法
可能很多小伙伴在使用pycharm 1,新建vue项目的时候并没有发现vue.js的名字, 2,新建.vue文件(即单文件组件)的时候没有 下面就来帮助大家一下,仅供参考 如图: 1.首先我们打开设置 ...
- C#上位机之—WinForm实现串口通信示例
上位机开发常用到串口通信来控制设备,串口通信的主要参数:COM口,波特率(9600),停止位(One),数据位(8),校验位(None),括号中的是常用值,具体意思我也不太懂,会用能实现功能就行哈哈: ...
- 数据库自学笔记(2)--- HAVING和WHERE, ANY 和 ALL,IN和EXIST。
1.HAVING和WHERE: WHERE 和 HAVING 的作用对象不一样.WHERE作用于基本表或视图,挑出满足条件的元组.HAVING作用于组(group),一般配合GROUP BY 使用. ...
- 循环删除List集合的元素
之前在使用list集合循环删除元素的时候,竟然出现了集合内的元素不能删除成功的问题,之后整理了一下,发现大有玄机! 1.如果指定了list的size大小,会出现下标越界异常 List<Strin ...
- P1345 [USACO5.4]奶牛的电信Telecowmunication【最小割】【最大流】
题目描述 农夫约翰的奶牛们喜欢通过电邮保持联系,于是她们建立了一个奶牛电脑网络,以便互相交流.这些机器用如下的方式发送电邮:如果存在一个由c台电脑组成的序列a1,a2,...,a(c),且a1与a2相 ...
- Jacoco收集单元测试、集成测试和系统功能测试覆盖率
Jacoco收集单元测试.集成测试和系统功能测试覆盖率 2020-02-27 目录 1 安装版本2 被测系统代码示例3 收集单元测试覆盖率4 收集集成和功能测试覆盖率 代码覆盖率可在单元测试.系统测 ...
- 【新人赛】阿里云恶意程序检测 -- 实践记录11.10 - XGBoost学习 / 代码阅读、调参经验总结
XGBoost学习: 集成学习将多个弱学习器结合起来,优势互补,可以达到强学习器的效果.要想得到最好的集成效果,这些弱学习器应当"好而不同". 根据个体学习器的生成方法,集成学习方 ...
- TCP与UDP的一些心得
1:CC攻击是正常的业务逻辑,大并发让你处理不过来,处理XP SP2,以上的系统都封了RAW格式协议封包自定义,除了基于应用层改协议,之外都是模拟或请求来测试传输层2:UDP不会粘包,不会少包,除非缓 ...
- python3-cookbook笔记:第二章 字符串和文本
python3-cookbook中每个小节以问题.解决方案和讨论三个部分探讨了Python3在某类问题中的最优解决方式,或者说是探讨Python3本身的数据结构.函数.类等特性在某类问题上如何更好地使 ...
- memcached的安装、常用命令以及在实际开发中的案例
Memcached注意缺乏安全认证以及安全管制需要将Memcached服务器放置在防火墙(iptables)之后 Linux平台 (CentOS)安装Memcached 安装依赖yum -y inst ...