【react】react创建项目与引入AntD组件库:

news2024/11/25 14:46:53

文章目录

        • 一、初始化项目:
            • 【1】创建项目
            • 【2】暴露项目配置文件
            • 【3】安装依赖
            • 【4】配置less
        • 二、快捷键:
            • 【1】`rcc+tab`
        • 三、安装AntD组件库:
            • 【1】安装
            • 【2】index.js
            • 【3】问题:
            • 【4】效果:


一、初始化项目:

【1】创建项目

npx create-react-app xxx //xxx为项目名称

【2】暴露项目配置文件

npm run eject

在这里插入图片描述

【3】安装依赖

npm i react-router-dom axios -D

yarn add less less-loader@5.0.0 -D

【4】配置less

复制sass的,改成less

在这里插入图片描述
在这里插入图片描述

二、快捷键:

【1】rcc+tab

在这里插入图片描述

三、安装AntD组件库:

【1】安装

npm install antd --save

【2】index.js

在这里插入图片描述

【3】问题:

【解决办法】:http://t.csdn.cn/dlh8U
在这里插入图片描述

【4】效果:

在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/373564.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【基于增强上下文注意网络:超分】

Enhanced Context Attention Network for Image Super Resolution (基于增强上下文注意网络的图像超分辨率) 深度卷积神经网络(CNN)极大地提高了图像超分辨率(SR)的性能。尽管图像随机共振的目标是恢复高频…

Mysql视图,存储过程,触发器,函数以及Mysql架构

一,视图视图是基于查询的一个虚拟表 , 也就是将sql语句封装起来, 要用的时候直接调用视图即可, select语句查询的表称为基表, 查询的结果集称为虚拟表, 基本表数据发生了改变, 那么视图也会发生改变, 使用视图就是为了简化查询语句.1.CREATE VIEW view_admin AS SELECT * FROM…

聊一聊过度设计!

文章目录什么是过度设计?过度设计的坏处如何避免过度设计充分理解问题本身保持简单小步快跑征求其他人的意见总结新手程序员在做设计时,因为缺乏经验,很容易写出欠设计的代码,但有一些经验的程序员,尤其是在刚学习过设…

top -p pid为什么超过100%

CPU:Cores, and Hyper-Threading 超线程(Hyper-Threading ) 超线程是Intel最早提出一项技术,最早出现在2002年的Pentium4上。单个采用超线程的CPU对于操作系统来说就像有两个逻辑CPU,为此P4处理器需要多加入一个Logic…

Spring Cache的基本使用与分析

概述 使用 Spring Cache 可以极大的简化我们对数据的缓存&#xff0c;并且它封装了多种缓存&#xff0c;本文基于 redis 来说明。 基本使用 1、所需依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-…

redis秒杀

redis优惠券秒杀 为什么订单表订单ID不采用自增长&#xff1f; id规律性太明显&#xff0c;容易被用户猜测到&#xff08;比如第一天下订单id10&#xff0c;第二天下订单id100&#xff0c;在昨天的1天内只卖出90商品&#xff09;受单表数据量限制&#xff08;订单数据量大&am…

Redis高级删除策略与数据淘汰

第二章&#xff1a;Redis高级 学习目标 目标1&#xff1a;能够说出redis中的数据删除策与略淘汰策略 目标2&#xff1a;能够说出主从复制的概念&#xff0c;工作流程以及场景问题及解决方案 目标3&#xff1a;能够说出哨兵的作用以及工作原理&#xff0c;以及如何启用哨兵 …

《分布式技术原理与算法解析》学习笔记Day23

分布式数据复制 我们在进行分布式数据存储设计时&#xff0c;通常会考虑对数据进行备份&#xff0c;以提高数据的可用性和可靠性&#xff0c;“数据复制技术”就是实现数据备份的关键技术。 什么是数据复制技术&#xff1f; 在分布式数据库系统中&#xff0c;通常会设置主备…

Java StringBuilder类(为什么更高效、常用方法、构造器)

StringBuilder类一、引言二、StringBuilder类特点三、StringBuilder构造方法四、StringBuilder常用方法五、StringBuilder为什么高效率六、StringBuffer类一、引言 为什么要引入StringBuilder类 提高字符串操作效率&#xff0c;尤其是涉及大量字符串拼接 //获取1970年1月1日0时…

2023年三月份图形化一级打卡试题

活动时间 从2023年3月1日至3月21日&#xff0c;每天一道编程题。 本次打卡的规则如下&#xff1a; 小朋友每天利用10~15分钟做一道编程题&#xff0c;遇到问题就来群内讨论&#xff0c;我来给大家答疑。 小朋友做完题目后&#xff0c;截图到朋友圈打卡并把打卡的截图发到活动群…

土著刷题新功能上线:根据每日学习时间,制定专属学习计划,多种数据统计维度追踪计划进度

吐槽社区的一个小伙伴在用土著刷题微信小程序进行碎片化学习&#xff0c;同时进行多科目题库练习的时候&#xff0c;不好追踪学习进度&#xff0c;希望有个能制定每日目标的功能。因此土著刷题微信小程序v1.11迭代开发了 学习计划 模块功能&#xff0c;学习计划是一个可以设置题…

HTML#3图片,音频,视频标签

一. 介绍1.标签与描述标签 描述<img> 定义图片<audio> 定义音频<video> 定义视频2.标签的详细介绍img:定义图片src:规定显示图像的 URL (统一资源定位符)height:定义图像的高度width:定义图像的宽度audio: 定义音频。支持的音频格式: MP3、WAV、OGGsrc:规定音…

角度制与弧度制的相互转换np.deg2radnp.rad2deg

【小白从小学Python、C、Java】【计算机等级考试500强双证书】【Python-数据分析】角度制与弧度制的相互转换np.deg2radnp.rad2deg选择题以下关于python代码表述错误的一项是?import numpy as npprint("【执行】np.rad2deg(np.pi)")print(np.rad2deg(np.pi))print(&…

有没有必要考PMP证书?

其实针对有没有必要考试吗&#xff0c;这个可以根本不同行业的人来决定的。 1.高等教育项目管理专业科班出身的人员。 在我国本科学历和硕士研究生学历中&#xff0c;项目管理也有开设。不管以后从事的工作是否为项目管理或其他管理&#xff0c;作为本专业的同学&#xff0c;…

HDMI协议介绍(三)--InfoFrame

目录 Auxiliary Video information (AVI) InfoFrame AVI InfoFrame包结构 Header Body 举个例子 附录 Audio InfoFrame Audio InfoFrame包结构 Header Body Vendor Specific InfoFrame Vendor Specific InfoFrame包结构 Header Body AVI/AUDIO/VSI Infoframe都…

Linux 操作系统原理 — 内存管理 — 虚拟地址空间(x86 64bit 系统)

目录 文章目录目录虚拟地址格式与内核页表&#xff08;四级页表&#xff09;虚拟地址格式与内核页表&#xff08;四级页表&#xff09; 在 x86 64bit 系统中&#xff0c;可以描述的最长地址空间为 2^64&#xff08;16EB&#xff09;&#xff0c;远远超过了目前主流内存卡的规格…

QML 颜色表示法

作者: 一去、二三里 个人微信号: iwaleon 微信公众号: 高效程序员 如果你经常需要美化样式(最常见的有:文本色、背景色、边框色、阴影色等),那一定离不开颜色。而在 QML 中,颜色的表示方法有多种:颜色名、十六进制颜色值、颜色相关的函数,一起来学习一下吧。 老规矩…

华为OD机试用Python实现 -【信号发射和接收】(2023-Q1 新题)

华为OD机试题 华为OD机试300题大纲信号发射和接收题目描述输入描述输出描述说明示例一输入输出说明示例二输入输出说明Python 代码实现代码运行结果代码编写思路华为OD机试300题大纲 参加华为od机试,一定要注意不要完全背诵代码,需要理解之后模仿写出,通过率才会高。 华为…

【蓝桥集训】第七天并查集

作者&#xff1a;指针不指南吗 专栏&#xff1a;Acwing 蓝桥集训每日一题 &#x1f43e;或许会很慢&#xff0c;但是不可以停下来&#x1f43e; 文章目录1.亲戚2.合并集合3.连通块中点的数量有关并查集的知识学习可以移步至—— 【算法】——并查集1.亲戚 或许你并不知道&#…

前端组件库自定义主题切换探索-03-webpack-theme-color-replacer webpack 同时替换多个颜色改造

接上一篇《前端组件库自定义主题切换探索-02-webpack-theme-color-replacer webpack 的实现逻辑和原理-02》 这篇我们来开始改造&#xff0c;让这个插件最终能达到我们的目的&#xff1a; 首先修改plugin.config.js。 插件首先要在vue.config.js引用注册&#xff0c;因此先对…