React项目引用antd

本文假设你已经创建好了React项目,参考上一篇文章webpack4设置react项目

1、通过npm安装antd

npm install -D antd

2、按需引用antd模块,使用 babel-plugin-import(推荐)

npm install -D babel-plugin-import

修改配置文件 .babelrc

// .babelrc or babel-loader option
{
  "plugins": [
    ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "css" }] // `style: true` 会加载 less 文件
  ]
}

3、接下来直接引用antd模块即可,如下图


React项目引用antd_第1张图片
QQ截图20180909002629.jpg

效果图


React项目引用antd_第2张图片
QQ截图20180909002715.jpg

你可能感兴趣的:(React项目引用antd)