安装依赖
npm install @ant-design/react-native --save
或
yarn add @ant-design/react-native
配置按需加载
安装babel-plugin-import组件
npm install babel-plugin-import --save-dev
babel.config.js配置文件增加如下配置:
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
['import', {libraryName: '@ant-design/react-native'}], // 与 Web 平台的区别是不需要设置 style
],
};
链接字体图标
npm install @ant-design/icons-react-native --save
或
yarn add @ant-design/icons-react-native --save
在 node_modules/@ant-design/icons-react-native/fonts 复制fonts文件
在 android/app/src/main 下创建assets文件夹
将复制的fonts文件粘贴到assets文件夹中
完成后在页面进行引入Icon
~~~
import { Icon } from "@ant-design/react-native";
<Icon name="aim"></Icon>
~~~
安装完图标依赖包后项目可能会报错,将fonts文件复制粘贴完成之后可以尝试删除图标依赖
~~~
npm uninstall @ant-design/icons-react-native --save
或
yarn remove @ant-design/icons-react-native --save
~~~