React Native中使用ant design
一、安裝和初始化
需要在命令行中安裝相應(yīng)工具,并且需要安裝安裝 yarn
npm install -g yarn
npm install -g create-react-app # web 項(xiàng)目
npm install -g create-react-native-app # react-native 項(xiàng)目
二、創(chuàng)建項(xiàng)目
create-react-app antm-demo # web 項(xiàng)目
create-react-native-app antm-demo # react-native 項(xiàng)目
啟動(dòng)項(xiàng)目
yarn start
運(yùn)行項(xiàng)目
yarn run android
三、引入 antd-mobile
yarn add antd-mobile
yarn add babel-plugin-import --dev
四、修改某些配置
1、修改 .babelrc 配置,并重新啟動(dòng)服務(wù)
{
"presets": ["babel-preset-expo"],
"plugins": [["import", { "libraryName": "antd-mobile" }]],
"env": {
...
}
}
2、修改 App.js, 引入 antd-mobile 按鈕組件。
...
import { Button } from 'antd-mobile';
...
render() {
return (
...
<Button>antd-mobile button</Button>
...
);
}