1、首先要安装务必确认 Node.js 已经升级到 v4.x 或以上。

2、打开cmd,输入“npm install antd-init -g”,安装antd(可以自己先指定安装目录);

3、antd安装成功后,输入“mkdir antd-demo”创建antd-demo;

4、接着输入“cd antd-demo”,开发demo的目录;

5、随后输入“antd-init”,安装npm依赖;

6、antd-demo文件夹里会产生一些文件,然后把文件夹里的index.js替换成下面的代码:

 import React from 'react';
import ReactDOM from 'react-dom';
import { DatePicker, message } from 'antd'; class App extends React.Component {
constructor(props) {
super(props);
this.state = {
date: '',
};
}
handleChange(date) {
message.info('您选择的日期是: ' + date.toString());
this.setState({ date });
}
render() {
return (
<div style={{ width: 400, margin: '100px auto' }}>
<DatePicker onChange={value => this.handleChange(value)} />
<div style={{ marginTop: 20 }}>当前日期:{this.state.date.toString()}</div>
</div>
);
}
} ReactDOM.render(<App />, document.getElementById('root'));

7、关掉所有cmd;

8、重新打开两个新的cmd,确定每个cmd都进入到antd-demo文件夹里;

9、其中一个cmd输入“npm srart”,开启服务器;

10、另一个cmd输入“npm run build”,构建和部署antd-demo;

11、浏览器地址栏输入“http://localhost:8000”,查看效果。

12、效果如下:

如何在win7上安装ant-design的更多相关文章

  1. 如何在windows7上安装启明星系统。

    启明星系统提供多种安装方式.安装包里自带了setup.exe.每个程序的 install下有在线安装(例如请假应用程序为book,则默认为 http://localhost/book/install ...

  2. 如何在Zabbix上安装MySQL监控插件PMP

    PMP,全称是Percona Monitoring Plugins,是Percona公司为MySQL监控写的插件.支持Nagios,Cacti.从PMP 1.1开始,支持Zabbix. 下面,看看如何 ...

  3. Win7上安装Linux双系统

    今天帮同学在Win7上安装Linux,感觉一篇教程很不错,mark一下 原地址:Win7下U盘安装Ubuntu14.04双系统步骤详解 一.前期准备 1.大于2G的U盘一个(我的系统盘制作完成后大约占 ...

  4. (转)如何在Windows上安装多个MySQL

    原文:http://www.blogjava.net/hongjunli/archive/2009/03/01/257216.html 如何在Windows上安装多个MySQL 本文以免安装版的mys ...

  5. 如何在win7上面安装python的包

    最近在win7上面搞python,然后写的一些代码涉及到了对Excel的读写.所以需要用到包xlrd xlwt  xlutils. 但问题是这些包import后显示的是找不到.错误提示是:Import ...

  6. Redis简介以及如何在Windows上安装Redis

    Redis简介 Redis是一个速度非常快的非关系型内存数据库. Redis提供了Java,C/C++,C#,PHP,JavaScript,Perl,Object-C,Python,Ruby,Erla ...

  7. 如何在centos7上安装源码包

    在我们使用linux的过程中,有很多程序是通过红帽官网给的系统中安装的,但是一般来说,系统更新的速度比较慢,如果这个时候我们又想用最新版的该怎么办呢?总不能一直等系统升级吧╮(╯﹏╰)╭所以,我们可以 ...

  8. 如何在CentOS上安装一个2048小游戏

    如何在centos上安装一个2048小游戏 最近在学习CentOS系统,就琢磨着玩点什么,然后我看到有人在玩2048小游戏,所有我就在想,为啥不装一个2048小游戏搞一下嘞,于是乎,我就开始工作啦 由 ...

  9. Linux,在不使用U盘的情况下使用wubi.exe程序在Win7上安装ubuntu-14.04.3版系统

    本文介绍如何在不使用U盘的情况下使用wubi.exe程序在Win7上安装ubuntu-14.04.3版系统. 花了一天的时间终于安装上了Ubuntu14.04,过程坎坷,是血泪史,开始报“cannot ...

随机推荐

  1. 如何理解泛型中的new()约束

    一:为什么需要New约束 假设有这样一个需求,它需要在定义一个泛型类时同时实例化T对象.有网友说了:"这还不简单,我立刻给你写一个",刷刷刷,得到以下的例子. public cla ...

  2. JAVASE02-Unit010: 多线程基础 、 TCP通信

    多线程基础 . TCP通信 * 当一个方法被synchronized修饰后,那么 * 该方法称为同步方法,即:多个线程不能同时 * 进入到方法内部执行. package day10; /** * 当多 ...

  3. ORA-03113: end-of-file on communication channel

    导致的原因,可能是异常断电导致文件状态不一致. SQL> startupORACLE instance started. Total System Global Area 1653518336 ...

  4. [CC]DgmOctree—执行Cell遍历和单元计算

    DgmOctree类的executeFunctionForAllCellsAtLevel和executeFunctionForAllCellsStartingAtLevel方法通过回调函数octree ...

  5. RabbitMQ系列之Centos 7安装RabbitMQ 3.6.1

    1.安装EPEL-7: rpm -ivh http://dl.fedoraproject.org/pub/epel/7/x86_64/e/epel-release-7-5.noarch.rpm 2.安 ...

  6. Spting--DI/IOC

    DI/IOC <bean> 代表由容器构建的对象(通过反射构建,且类必须有无参的构造方法)  公共属性 id="唯一的id" 在容器中是唯一的 name="类 ...

  7. C# DataTable中根据某Column值(不重复)获取该值所在行

    System.Data.DataTable dt = new System.Data.DataTable(); dt.PrimaryKey = new System.Data.DataColumn[] ...

  8. Easy Tag Write(1)

    package skyseraph.easytagwrite; import skyseraph.android.util.CustomDialog; import skyseraph.android ...

  9. 用mac系统制作mac系统启动盘

    1.找一个大于8G的U盘,最好3.0接口 2.将U盘插入电脑,打开电脑的磁盘工具,将其抹去为“Mac OS扩展”格式,名称随意 3.下载一个mac系统dmg镜像 4.在系统中打开镜像 5.打开终端,输 ...

  10. JAVA用途

    在现今阶段,最有前途的开发语言当属Java,Java语言是跨平台的,Write Once,Run Anywhere是Java的一句口号,学Application编程,可以在计算机上写程序,学Apple ...