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. imx6 usb otg config 配置

    imx6 usb的host和slave配置,配置之后,安装gadget模块,就能够在host和slave之间切换. 参考文档: i.MX 6Dual/6Quad Linux Reference Man ...

  2. Swift:属性观察器

    1.简单介绍 属性观察器监控和响应属性值的变化,每次属性被设置值的时候都会调用属性观察器,甚至新的值和现在的值相同的时候也不例外. 可以为除了延迟存储属性之外的其他存储属性添加属性观察器,也可以通过重 ...

  3. C++学习笔记 构造&析构 友元 new&delete

    构造&析构函数 构造函数 定义:与类同名,可以有参可以无参,主要功能用于在类的对象创建时定义初始化的状态,无返回值,也不能用void修饰,构造函数不能被直接调用,必须通过new运算符在创建对象 ...

  4. centos7 firewalld

    1.firewalld简介 firewalld是centos7的一大特性,最大的好处有两个: 1.支持动态更新,不用重启服务: 2.加入了防火墙的"zone"概念   firewa ...

  5. 总结ThinkPHP使用技巧经验分享(一)

    约定:1.所有类库文件必须使用.class.php作为文件后缀,并且类名和文件名保持一致2.控制器的类名以Action为后 缀3.模型的类名以Model为后缀,类名第一个字母须大写4.数据库表名全部采 ...

  6. BufferedReader与Scanner的区别

    在Java中,我们都知道Java的标准输入串是System.in.但是我们却很少在Java中看到谁使用它,这是因为我们平时输入的都是一个字符串或者是一个数字等等.而System.in提供的read方法 ...

  7. 4-Server安全配置

    0-禁止root使用ssh登入 vim /etc/ssh/sshd_config寻找:PermitRootLogin yes改为:PermitRootLogin nosystemctl restart ...

  8. Ref和Out参数的区别(转帖)

    首先,如果不使用这两个关键字,那是什么样 呢? 看下面的例子: using System;   class Test   {   static void Swap(ref int x, ref int ...

  9. Hadoop组件构成

    Hadoop平台重要组件: 1.ZooKeeper 一个分布式应用程序协调服务. 包含简单的原语集.实现统一命名服务.配置管理.分布式锁服务.集群管理等功能. 2.Cascading 架构在 Hado ...

  10. 在jasp页面循环显示

    <% int h=3;//行数 int l=3;//列数 %> <table> <% for(int i=0;i<h;i++){ %> <tr> ...