create-react-app实现antd的按需加载
2019-03-15 本文已影响0人
xiao_333
按需加载antd的实现方式:
用create-react-app创建项目后,如果需要第三方的插件库,需要配置webpack配置文件,步骤如下:
- 首先运行npm run eject暴露出webpack的配置文件,项目对多出config和scripts文件夹
- 安装完antd和babel-plugin-import后,修改根目录下的package.json babel处,在persets后面添加
"plugins":[["import",{"libraryName": "antd", "style": "css"}]]
修改babel配置.jpg
安装antd
cnpm i antd --save
安装babel-plugin-import
cnpm i babel-plugin-import --save-dev
- 运行npm start开启工程,在文件中按需要引入antd的组件即可
import React from 'react';
import { Button } from 'antd';
class App extends React.Component {
render() {
return (
<div>
<header>
<Button type="danger">lock me</Button>
</header>
</div>
)
}
}