React Native 导出项目全局共用组件的模块

因为之前的一个地址挑选器被里面有这样的导出方式被网友察觉，然后私信问了我，怎么导出这样的模块

import { ReactNavComponent, Widget, Util } from 'rn-yunxi';const { RegexpUtil, StorageUtil } = Util;const { Button， Text } = Widget;

写一篇文章，希望对大家有用：

首先在项目中文件下新建rn-yunxi文件夹， 然后再package.json文件中导入 “rn-yunxi”: “file:./rn-yunxi”,

{  "name": "o2oApp",  "version": "0.0.1",  "private": true,  "scripts": {    "start": "node node_modules/react-native/local-cli/cli.js start",    "theme": "node scripts/custom-andt-theme",    "test": "jest"  },  "dependencies": {    "antd-mobile": "^1.4.2",    "autobind-decorator": "^2.1.0",    "events": "^1.1.1",    "mobx": "^3.3.1",    "mobx-react": "^4.3.4",    "rc-form": "^1.3.1",    "react": "16.0.0-alpha.6",    "react-native": "file:../rn-yunxi/react-native",    "rn-yunxi": "file:./rn-yunxi",    "vdjs": "^1.0.0"  },  "devDependencies": {    "babel-jest": "20.0.1",    "babel-plugin-import": "^1.1.1",    "babel-plugin-transform-decorators-legacy": "^1.3.4",    "babel-preset-react-native": "1.9.1",    "jest": "20.0.1",    "react-test-renderer": "16.0.0-alpha.6"  },  "jest": {    "preset": "react-native",    "transformIgnorePatterns": [      "node_modules/(?!(jest-)?react-native|react-navigation)"    ]  }}

然后在rn-yunxi声明一个index.js文件，用来导出你封装的组件类，注意导出写法 import * as 和 export

import * as Widget from  './lib/widget';import * as Util from  './lib/util';export {    Widget,    Util,};

接下来在Util中新建一个index.js导出你的组件

export { default as RegexpUtil } from './RegexpUtil';export { default as DateUtil } from './DateUtil';

在Widget中新建一个index.js导出你的组件

export { default as Button } from './button';export { default as Text } from './text';

然后在你项目中可以使用

import {Widget, Util } from 'rn-yunxi';const { RegexpUtil, DateUtil } = Util;const { Button， Text } = Widget;