## 米家扩展程序中使用的 React Native UI 组件

## [组件文档](/ComponentsOverview.md)

## [变更日志](/CHANGELOG.md)

## 按需加载

Metro bundler (RN 0.61) 不支持 tree-shaking，默认从 barrel 导入会将所有组件打包。推荐使用 `babel-plugin-import` 实现按需加载。

### 1. 安装依赖

```bash
npm install babel-plugin-import -D
```

### 2. 配置 babel.config.js

```js
const mhuiImportMap = require('mhui-rn/importMap');

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    ['import', {
      libraryName: 'mhui-rn',
      camel2DashComponentName: false,
      customName: (name) => mhuiImportMap[name],
    }, 'mhui-rn'],
  ],
};
```

### 3. 使用方式不变

```js
// 写法不变，插件会自动转换为深路径引用
import { Switch, Slider } from 'mhui-rn';

// 实际编译为：
// import { Switch } from 'mhui-rn/dist/hyperOS/components/switch';
// import { Slider } from 'mhui-rn/dist/hyperOS/components/slider';
```

## 注意，在非 miot-plugin-sdk 中使用，需要安装一下依赖
`npm install react-native-indicators@0.13.0 react-native-iphone-x-helper@1.2.0 react-native-linear-gradient@2.5.4 react-native-progress@3.5.0 react-native-root-siblings@4.0.6 react-native-shadow@1.2.2 react-native-slider@0.11.0 react-native-svg@9.5.3 react-native-swiper@1.6.0-nightly.5 react-native-ui-kitten@3.1.2 react-navigation@2.16.0`