当前位置: 首页 > news >正文

Ant Design of React 创建项目及运行环境

Ant Design of React 学习笔记(1)

创建项目及运行环境

本文使用 create-react-app 创建一个 TypeScript 项目,并引入 antd。

1.命令行cd到对应的目录,这里是npm下回车运行,其他如pnpm yarn参考官网

npx create-react-app antd-demo --template typescript

antd-demo就是项目名称,可以自己随意起

2.进入项目并运行 cd到项目下运行 npm run start

cd antd-demo
npm run start

此时浏览器会访问 http://localhost:3000/ ,看到 Welcome to React 的界面就算成功了。

3.安装Ant design

npm install antd --save
回传运行安装完成

在package.json 文件下会看到antd 相关信息,如果要使用sass或者less预编样式、axios数据请求这些按需npm安装即可。
react-router-dom这个是路由,后面要用到路由跳转,项目目录下运行

npm install react-router-dom

在这里插入图片描述

相关文章:

Ant Design of React 创建项目及运行环境

Ant Design of React 学习笔记(1) 创建项目及运行环境 本文使用 create-react-app 创建一个 TypeScript 项目,并引入 antd。 1.命令行cd到对应的目录,这里是npm下回车运行,其他如pnpm yarn参考官网 npx create-reac…...

NoSQL之Redis 主从复制配置详解及哨兵模式

目录 1 Redis 主从复制 1.1 主从复制的作用 1.2 主从复制流程 2 搭建Redis 主从复制 2.1 安装 Redis 2.2 修改 Redis 配置文件(Master节点操作) 2.3 修改 Redis 配置文件(Slave节点操作) 2.4 验证主从效果 3 Redis 哨兵模…...

界面组件DevExpress WinForms v23.2新功能预览 - 增强MVVM相关功能

本文主要描述了DevExpress WinForms即将在几个月之后发布的v23.2中包含的新功能,持续关注我们获取更多最新资讯哦~ DevExpress WinForms有180组件和UI库,能为Windows Forms平台创建具有影响力的业务解决方案。同时能完美构建流畅、美观且易于使用的应用…...

vue3前端开发-开发环境安装篇

文章目录 1.安装nvm2.设置安装源为淘宝镜像3.通过nvm安装nodejs4. 安装pnpm4.1 安装pnpm4.2 配置 5.创建vite-vue项目6. vue3demo目录结构7. 扩展插件安装8. 用户代码片段8.1 设置8.2 快速生成代码 1.安装nvm 如果本地已经安装了nodejs,请先卸载。 nvm主要的作用就是…...

MVCC和BufferPool缓存机制

文章目录 1. MVCC多版本并发控制机制2. BufferPool缓存机制 1. MVCC多版本并发控制机制 Mysql可以在可重复读隔离级别下可以保证事务较高的隔离性,这个隔离性是由MVCC机制来保证的,对一行数据的读和写两个操作默认是不会通过加锁互斥来保证隔离性&#…...

论文阅读笔记(Clover: 计算与存储被动分离的分布式键值存储系统)

关于Disaggregating Persistent Memory and Controlling Them Remotely: An Exploration of Passive Disaggregated Key-Value Stores这篇论文的笔记 原文链接 提出背景 传统的分布式存储系统中,每个节点都会包含计算和存储两个部分,一个节点既可以访…...

大模型推理框架概述

从 ChatGPT 面世以来,引领了大模型时代的变革,除了大模型遍地开花以外,承载大模型进行推理的框架也是层出不穷,大有百家争鸣的态势。本文主要针对业界知名度较高的一些大模型推理框架进行相应的概述。 简介 vLLM是一个开源的大模…...

抖音商品详情数据接口,抖音商品详情API接口

抖音商品详情API接口获取数据,接口对接可获取到商品标题,商品价格,商品优惠价,优惠券信息,店铺昵称,sku信息,sku主图,视频链接,详情主图,库存,数量…...

睿趣科技:抖音开网店怎么开通

在当前的数字时代,电子商务已经成为一种主流的商业模式。抖音作为中国最大的短视频平台,也提供了这种能力,让商家能够在平台上开设自己的网店。那么,如何在抖音上开通网店呢?下面是详细的步骤: 注册抖音账号 首先&…...

体育场馆能源消耗监测管理平台,为场馆提供能源服务

随着能源问题的不断重视,体育场馆能源问题也被人们广泛的关注。为了让体育场馆的能源高效利用,体育场馆能源消耗监测管理平台应用而生。 该平台通过采集、监测场内数据,并对数据进行实时分析与反馈,从而帮助管理者了解到场内能源…...

前端本地存储方案-localForage-vue3中使用

前言 前端有多种本地存储方案可供选择,常见的有: Cookie:小型的文本文件,存储少量数据Web Storage :包括:localStorage和sessionStorage,存储数据有上限(5M)左右Indexe…...

vivo年度新“机皇”X100系列要来了!

据供应链消息,vivo X90系列为满足旺盛的市场需求,曾经两次加单生产。 X90系列发布至今已超过11个月,竟然还保持着如此火爆大卖的状态,,令行业关注。而X系列即将发布的下一代产品X100系列,则让中高端消费者们更加期待。…...

滴滴发布十一大数据:延边出行需求上涨280% 西部省份成旅游热点

今年十一假期适逢中秋佳节,在亲友团聚和长假出游的多重期盼下,超级黄金周展现强劲内需,带动多样化的消费趋势,出行热情也随之高涨。滴滴出行数据显示,打车需求相比去年同期上涨80%,高峰时段每分钟呼叫突破1…...

Allegro如何查看器件的管脚号?

Allegro在默认情况下,器件是不显示管脚号的。 Allegro默认情况下,器件不显示管脚编号。 在PCB布局时,有时候我们需要看器件的管脚号,然后才能方便布局。那如何查看器件的管脚号呢? 这里介绍两种查看器件的管脚编号的方法。 方法一: (1)选择菜单Display→Color/Visi…...

苹果电脑用什么清理软件比较好?

很多人都会有这样的误解:mac系统不用清理。实际上mac只是将系统垃圾隐藏了,并且需要通过特定的方式打开。但其实在我们日常工作不用这么麻烦,我们只需用苹果电脑专业的清理软件就好了。今天小编就给大家分享一下mac用什么清理软件好 一、mac用…...

被装超市管理系统-智被装DW-S305系统组成项目背景

项目背景 被装管理是JD后勤管理的一个重要组成部分,现在的被装管理的手工方式已不能适应被装管理现代化的需求,存在诸多问题,还需要依托大量的人力物力,对于一些品规较多、出入库频率较高的仓库,这样的管理方式显得捉…...

使用“Apple 诊断”测试你的 Mac(查看电池是否到达更换标准)

使用“Apple 诊断”测试你的 Mac “Apple 诊断”(以前称为“Apple Hardware Test”)可以检查你的 Mac 是不是存在硬件问题。 如果你认为你的 Mac 可能存在硬件问题,可以使用“Apple 诊断”来帮助确定可能存在故障的硬件组件。“Apple 诊断”…...

ElementUI增删改的实现及表单验证

文章目录 一、准备二、添加功能2.1 新增添加按钮2.2 添加弹出框2.3 data中添加内容2.4 methods中添加相关方法 三、编辑功能3.1 表格中添加编辑和删除按钮3.2 methods中添加方法3.3 修改methods中clear方法3.4 修改methods中的handleSubmit方法 四、删除书籍功能4.1 往methods的…...

基于Google‘s FCM实现消息推送

当然&#xff0c;下面是一个简单的示例&#xff0c;演示了如何使用 Service Worker 和 Googles Firebase Cloud Messaging&#xff08;FCM&#xff09;来实现 Web 推送通知。 1. HTML 文件&#xff08;index.html&#xff09; <!DOCTYPE html> <html> <head&g…...

若依微服务前后端部署启动流程(只记录)

若依官网&#xff1a;https://www.ruoyi.vip/ 若依源码下载&#xff0c;直接zip既可&#xff1a;RuoYi-Cloud: &#x1f389; 基于Spring Boot、Spring Cloud & Alibaba的分布式微服务架构权限管理系统&#xff0c;同时提供了 Vue3 的版本 下载解压&#xff0c;导入 idea&…...

变量 varablie 声明- Rust 变量 let mut 声明与 C/C++ 变量声明对比分析

一、变量声明设计&#xff1a;let 与 mut 的哲学解析 Rust 采用 let 声明变量并通过 mut 显式标记可变性&#xff0c;这种设计体现了语言的核心哲学。以下是深度解析&#xff1a; 1.1 设计理念剖析 安全优先原则&#xff1a;默认不可变强制开发者明确声明意图 let x 5; …...

React Native 导航系统实战(React Navigation)

导航系统实战&#xff08;React Navigation&#xff09; React Navigation 是 React Native 应用中最常用的导航库之一&#xff0c;它提供了多种导航模式&#xff0c;如堆栈导航&#xff08;Stack Navigator&#xff09;、标签导航&#xff08;Tab Navigator&#xff09;和抽屉…...

《Playwright:微软的自动化测试工具详解》

Playwright 简介:声明内容来自网络&#xff0c;将内容拼接整理出来的文档 Playwright 是微软开发的自动化测试工具&#xff0c;支持 Chrome、Firefox、Safari 等主流浏览器&#xff0c;提供多语言 API&#xff08;Python、JavaScript、Java、.NET&#xff09;。它的特点包括&a…...

关于nvm与node.js

1 安装nvm 安装过程中手动修改 nvm的安装路径&#xff0c; 以及修改 通过nvm安装node后正在使用的node的存放目录【这句话可能难以理解&#xff0c;但接着往下看你就了然了】 2 修改nvm中settings.txt文件配置 nvm安装成功后&#xff0c;通常在该文件中会出现以下配置&…...

【android bluetooth 框架分析 04】【bt-framework 层详解 1】【BluetoothProperties介绍】

1. BluetoothProperties介绍 libsysprop/srcs/android/sysprop/BluetoothProperties.sysprop BluetoothProperties.sysprop 是 Android AOSP 中的一种 系统属性定义文件&#xff08;System Property Definition File&#xff09;&#xff0c;用于声明和管理 Bluetooth 模块相…...

PL0语法,分析器实现!

简介 PL/0 是一种简单的编程语言,通常用于教学编译原理。它的语法结构清晰,功能包括常量定义、变量声明、过程(子程序)定义以及基本的控制结构(如条件语句和循环语句)。 PL/0 语法规范 PL/0 是一种教学用的小型编程语言,由 Niklaus Wirth 设计,用于展示编译原理的核…...

[Java恶补day16] 238.除自身以外数组的乘积

给你一个整数数组 nums&#xff0c;返回 数组 answer &#xff0c;其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法&#xff0c;且在 O(n) 时间复杂度…...

OpenLayers 分屏对比(地图联动)

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 地图分屏对比在WebGIS开发中是很常见的功能&#xff0c;和卷帘图层不一样的是&#xff0c;分屏对比是在各个地图中添加相同或者不同的图层进行对比查看。…...

全志A40i android7.1 调试信息打印串口由uart0改为uart3

一&#xff0c;概述 1. 目的 将调试信息打印串口由uart0改为uart3。 2. 版本信息 Uboot版本&#xff1a;2014.07&#xff1b; Kernel版本&#xff1a;Linux-3.10&#xff1b; 二&#xff0c;Uboot 1. sys_config.fex改动 使能uart3(TX:PH00 RX:PH01)&#xff0c;并让boo…...

sipsak:SIP瑞士军刀!全参数详细教程!Kali Linux教程!

简介 sipsak 是一个面向会话初始协议 (SIP) 应用程序开发人员和管理员的小型命令行工具。它可以用于对 SIP 应用程序和设备进行一些简单的测试。 sipsak 是一款 SIP 压力和诊断实用程序。它通过 sip-uri 向服务器发送 SIP 请求&#xff0c;并检查收到的响应。它以以下模式之一…...