之前试过引入多次ant-design,引用代码
$ npm install antd-mobile --save
官网这个。一直报错类似某个css不能resolve。应该是普通的css在reactnative中不能识别使用。
react-native mobile的官方地址:https://mobile.ant.design/index-cn
demo演示地址:https://mobile.ant.design/kitchen-sink/
-
引入 yarn add @ant-design/react-native
-
根目录下新建文件.babelrc (用于ant-design库的按需引入)
//代码如下
{
"plugins": [
[
"import",
{
"libraryName": "@ant-design/react-native"
}
]
]
}
-
运行之后可能报错:没有模块:babel-plugin-import。没有报错请跳过。
运行yarn add babel-plugin-import即可。
-
页面上引入方式:
import {Flex,WhiteSpace} from '@ant-design/react-native';
<Flex>
<Flex.Item><Text>1</Text></Flex.Item>
<Flex.Item><Text>2</Text></Flex.Item>
<Flex.Item><Text>3</Text></Flex.Item>
</Flex>
<WhiteSpace size="lg" />