react-项目搭建(dva+antd)

dva 是一个基于 React 和 Redux 的轻量应用框架,概念来自 elm,支持 side
effects、热替换、动态加载、react-native、SSR 等,已在生产环境普遍应用。

1、安装dva-cli

全局安装dva-cli,在终端输入css

npm install dva-cli -g

确保版本是0.9.1或以上react

dva -v

2、建立新项目

经过 dva new 建立新应用,包含项目初始化目录和文件,并提供开发服务器、构建脚本、数据 mock 服务、代理服务器等功能webpack

dva new dva-demo

3、启动项目

cd进入dva-demo目录,并启动开发服务器web

cd dva-demo
npm start

clipboard.png

4、使用antd

经过 npm 安装 antd 和 babel-plugin-import 。npm

babel-plugin-import 是用来按需加载 antd 的脚本和样式的
npm install antd babel-plugin-import --save

编辑 .webpackrc,使 babel-plugin-import 插件生效。react-native

{
+  "extraBabelPlugins": [
+    ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "css" }]
+  ]
}

页面中使用antd组件服务器

import { Table, Button, Form, Input, Select, } from 'antd';
相关文章
相关标签/搜索