Ant Design Pro complete版本的下载及运行

news/2024/7/23 11:23:36 标签: anti-design-vue, react.js, typescript, reactjs

前言

complete 版本提供了很多基础、美观的页面和组件,对于前端不太熟练的小白十分友好,可以直接套用或者修改提供的代码完成自己的页面开发,简直不要太爽。故记录一些下载的步骤。

环境

E:\code>npm -v
9.8.1

E:\code>node -v
v18.15.0

下载

根据官方提示下载即可:ANT DESIGN PRO

代码下载

在这里插入图片描述
点击开始使用,根据提示完成下载操作
在这里插入图片描述
在命令行中分别输入以下命令:

# 使用 npm
npm i @ant-design/pro-cli -g
pro create myapp # 自己的项目名

在这里插入图片描述
创建时选择compele
在这里插入图片描述
在这里插入图片描述

依赖安装

使用编译器打开项目
在这里插入图片描述
运行npm install 下载依赖
在这里插入图片描述
出现报错:peer react@“^16.8.6 || ^17.0.2” from @antv/l7-react@2.4.3,说版本依赖冲突

使用npm install --legacy-peer-deps 命令绕过依赖冲突下载

npm install --legacy-peer-deps

在这里插入图片描述

在这里插入图片描述

项目运行

使用npm run start 命令以mock 模式运行

npm run start

在这里插入图片描述
在这里插入图片描述
8000端口访问
在这里插入图片描述
出现白板,按F12 -> 控制台中查看报错信息
在这里插入图片描述
路由/*配置的问题
找到项目中的config/routes.ts,将40-43行的代码注释,注意位置,不要配错
在这里插入图片描述
出来了!!!
在这里插入图片描述
根据提示填写账号密码登录
在这里插入图片描述
下载及运行完成!!!

总结

  1. 下载步骤直接根据官网提示即可
  2. 安装依赖时可能会出现依赖冲突,此时加后缀--legacy-peer-deps重新下载
  3. 运行项目后会出现白板,此时在routes.ts 文件中把相应的位置上的代码注释掉

http://www.niftyadmin.cn/n/5431792.html

相关文章

ubuntu(20.04)-安装JAVA环境-IDEA

1.下载IDEA 2.解压文件 sudo tar -zxvf idealC-2022.2.3.tar.gz -C /opt 3.添加环境变量: .vim ~/.bashrc export IDEA_HOME/opt/ideaIC-2022.2.3/ export PATH${IDEA_HOME}/bin:$PATH source ~/.bashrc 4.启动: cd /opt/ideaIC-2…

C/C++ Socket 获取或设置 TCP MSS 大小

通过 Socket 系统接口,链接到一个TCP服务器,那么在链接成功之后会被配置一个从本地端到目的端最佳的TCP_MSS大小。 我们通过这个特点,即可轻松的实现,链路MTU大小发现功能,在不依赖ROOT管理员权限的情况下,…

sui move动态字段练习(5)- 总结与思考

引言 之前几篇文章,我们用sui move动态字段模拟solidity映射,实现了一个类似erc20的代币,这使我更加深刻地理解了sui move和solidity编程特性和编程思想的区别。下面是我的总结与思考。 总结 首先,sui与solidity的编程特性有很…

数字孪生10个技术栈:数据清洗-数据的洗衣机

大家好,我是贝格前端工场,上期讲了数据传输的四个问题,本期继续分享数据采集后如何获得格式化的有效数据,那就是数据清洗,大家如有数字孪生或者数据可视化的需求,可以联络我们。 一、数据清洗含义和所需工…

吐槽FineDataLink工具Format函数处理日期转字符串格式的说明文档

一.背景 为公司师带徒的任务做些记录。 二.文档存在的问题 1.文档情况 FORMAT-格式转换- FineBI帮助文档 FineBI帮助文档 函数定义: FORMAT(object,format) formart的格式有哪些呢?我们截图看看: 2.文档说明不足问题 同事的需求是把时…

Python环境安装与配置(Windows环境)

Python目前已支持所有主流操作系统,在Linux,Unix,Mac系统上自带Python环境,在Windows系统上需要安装一下,超简单 一、下载Python 打开官网 Download Python | Python.org 下载中心,根据自己的系统和版本选择合适的安装包&#xf…

基于springboot+vue实现养老服务管理系统项目【项目源码+论文说明】

基于springbootvue实现养老服务管理系统演示 摘要 医疗水平和生活水平的不断提高造就了我们现在稳定、发展的社会,带来受益的同时也加重了人口老龄化程度。随着人口老龄化程度的不断加深,越来越多的社会资源在对养老方面注入。那么面对如此快速发展的养…

Unity PS5开发 天坑篇 之 DEVKit环境部署与系统升级02

上一篇各位大神们已经收到了SONY官方免费寄送的PS5开发机与测试机,恭喜大家成为SONY的开发者, 本篇继续PS5开发机的部署与开发套件使用。 一, PC安装PS5 SDK与系统升级 1. PC/PS5 SDK Manager下载安装包 登录开发者账号后,Development->Resources&a…