首页 > 其他分享 >umi3使用ant design landing

umi3使用ant design landing

时间:2024-10-10 23:22:22浏览次数:8  
标签:npm index less umi3 ant design install rc antd

创建umi3项目

使用node16

1.创建一个空文件夹

mkdir myapp && cd myapp

2.使用@umijs/umi-app创建项目

npx @umijs/create-umi-app

3.安装依赖

npm i

4.降低antd版本

npm uninstall antd
npm install [email protected]

5.将从 landing 上下载的 Home 文件包和 pages 放至 src 文件包里

│── src
│ │── Home 
│    │── less
│    │── index.js
│    └── ...
│ └── pages     
│    │── index.js
│    │── index.less

6.安装依赖

npm install antd enquire-js rc-queue-anim rc-scroll-anim rc-tween-one --save;
npm install rc-banner-anim --save;// 如果用的是多屏滑动型的 banner,加上这条;
npm install @ant-design/[email protected] --save;// 如果使用了 Content7 模块,请加上这条;

7.调整less文件

less/custom.less 里的 @import "~antd/lib/style/themes/default.less"; 更换成@import "~antd/lib/style/index.less";

标签:npm,index,less,umi3,ant,design,install,rc,antd
From: https://www.cnblogs.com/tian0926/p/18457437

相关文章

  • ant design react 表单设置初始值及更新表单数据
    importReactfrom'react';import'./index.css';import{Button,Form,Input}from'antd';constApp=()=>{const[form]=Form.useForm();constupdateValue=()=>{//假设我们要更新的字段是'username'......
  • web端ant-design-vue Upload 手动实现文件上传使用小节
     web端ant-design-vueUpload手动实现文件上传使用小节。最近在项目开发中用到了手动实现文件上传的组件,之前都是自动上传把返回的文件信息保存到服务器。手动上传相对复杂一下,我把遇到的一些问题整理记录一下,有需要的朋友可以避免走弯路!1、文件上传需要用formdata格式,需......
  • web端ant-design-vue Modal.info组件自定义icon和title使用小节
     web端ant-design-vueModal.info组件自定义icon和title整理小节,最近在项目中用到了自定义icon和title的功能,经过测试发现,如果自定义icontitle会自动换行,尝试直接修改样式和穿透方式都没有效果,最后采取了一个巧妙的方式,将icon和title放在一个自定义组件内,完美解决!代码如下......
  • antv X6 全局禁用节点和边拖动,画布可以拖动
    项目有个需求,通过接口获取用户权限,限制用户拖动节点和边查阅文档和百度发现Graph可以配置interacting来限制节点和边的交互但是用户的权限通过接口获取,如何动态配置interacting是否为false1、节点的node.prop可以进行通信,但是需要遍历画布的所有节点,参考https://codesa......
  • ant-design 使用Modal组件报错问题记录
    打开modal组件会提示如下报错信息高版本chrome浏览器会出现这个问题 原因是:不能在获得焦点的元素或其祖先上使用aria-hidden解决方案:全局添加如下CSS,暂时将Modal中该属性的元素隐藏掉.ant-modaldiv[aria-hidden="true"]{display:none!important;} ......
  • antd中的多选框defaultValue失效问题
    antd中的Checkbox.Group属性中的 defaultValue为数组当改变某个状态需要改变这个数组发现失效解决办法:            Checkbox.Group添加key值为defaultValue指定的数组 当key值发生变化组件会重新渲染,从而使更新后的defaultValue属性生效。原因:defaultVa......
  • HarmonyOS开发——编译报错“The reason and usedScene attributes are mandatory for
    问题现象:DevEcoStudio编译失败,提示“ThereasonandusedSceneattributesaremandatoryforuser_grantpermissions”。问题原因:从DevEcoStudioNEXTDeveloperPreview2版本开始新增规则:APP包中,所有entry和featurehap的module下的requestPermissions权限清单必须指定(......
  • 题解:CF1007D Ants
    题目传送门每只蚂蚁只走一对点肯定是不劣的,由此想到2-sat。限制条件是:若\((a,b)\)和\((c,d)\)两条链相交,则不能同时选。直接建图肯定是爆炸的。用树剖可以将\((a,b)\)这条链划分成\(O(\logn)\)个区间。因为同一条链的区间不交,限制条件变为若两个区间相交,则这两个点不......
  • 探讨微服务治理场景中,Sermant Backend如何管理插件动态配置
    本文分享自华为云社区《SermantBackend配置管理功能在微服务治理场景中的应用》,作者:华为云开源。一、背景Sermant是基于Java字节码增强技术的无代理服务网格,业务应用通过JavaAgent的方式将Sermant挂载至目标进程中。其中动态配置是Sermant框架中的关键能力,它能够在微服务挂载Se......
  • Porsche PIWIS 3 is the latest diagnostic tool specifically designed for Porsche
     Ifyou'reaPorscheenthusiastoraprofessionalmechanic,youknowhowcrucialitistohavetherightdiagnostictoolsatyourdisposal.Amongthesetools,thePorschePIWIS3softwarestandsoutasoneofthemostadvancedandversatileoptions......