（架構）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」,

"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" }, 

而後在rn-yunxi聲明一個index.js文件，用來導出你封裝的組件類，注意導出寫法 import * as 和  export

這裏的*表明widget裏面的全部組件和工具

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;

 

 

 

原文連接：https://blog.csdn.net/weixin_40166364/article/details/78539352