fego-rn
v0.1.6
Published
基于 React Native 的移动开发库
Downloads
6
Readme
fego-rn
- React Native 组件库
项目介绍
- 基于 React Native 的移动开发库
- 提供 ios 和 android 两端的平台支持
- 仅限 UI 组件和 Util 组件, 不涉及原生组件
支持平台
- ios
- android
设计原则
- 组件命名以使用驼峰形式且首字母大写,例如:
ActivityIndicator
- 若无特殊情况组件不区分 ios 和 android 平台,统一为
SomeComponent/index.js
, 不带 ios 或 android 后缀 - API 设计规范详见
- 组件样式详见
目录结构
.
├── __tests__ # 组件单元测试目录
│ ├── enzyme.setup.js # enzyme 启动配置文件
├── components # 组件源码
│ ├── common # 通用类
│ ├── util # util 组件
│ ├── ui # ui 组件
│ ├── index.js # 入口文件
│ ├── patch.js # 补丁文件
│ ├── README.md # 关于组件的说明
│ └── STYLE.md # 关于样式的说明
├── demo # demo 示例
│ ├── android # android 工程
│ ├── app # demo 源码
│ └── ios # ios 工程
├── site # 组件文档站点的目录
│ ├── build # bisheng 编译输出文件夹
│ ├── theme # bisheng 主题文件夹
│ └── bisheng.onfig.js # bisheng 配置文件
├── .babel # babel 配置
├── jest.config.js # jest 测试配置文件
└── package.json # 项目描述文件
开发
1.安装依赖
$ npm run init
2.运行 demo包服务
$ npm run start
3.运行 模拟器
xcode 或 Android Studio 中点击
RUN
运行项目即可或者使用下面的命令
# ios 端
$ npm run ios
# Android 端
$ npm run android
4.启动假数据服务
$ npm run mock
5.进行单元测试
$ npm run test
# 更新 snapshot
$ npm run test -- -u
6.启动站点服务
$ npm run site
使用
1.安装
$ npm install fego-rn --save
2.应用
// MyPage.js
import { Button } from 'fego-rn'
class MyPage extends React.Component {
render(){
return(
<View>
{/* your code */}
<Button type='primary' title='我是一个button' />
</View>
)
}
}
注意
- 组件,如
Popup
,Toast
等都是依赖AppContainer
设计的,因此在使用 fego-rn 时请使用AppContainer
对应用进行包装import { AppContainer } from 'fego-rn' AppRegistry.registerComponent('App', () => AppContainer.setApp(App) )
常见问题
启动服务后报错 Error watching file for changes: EMFILE
Mac升级后watchman不可用了,需要重装watchman。
- 第一种解决方案:
- 卸载: brew uninstall --force watchman
- 删除文件: rm -rf /usr/local/var/run/watchman/
- 重装: brew install watchman
- 第二种解决方案: 来自官方:https://facebook.github.io/watchman/docs/install.html
欢迎贡献
有任何疑问或问题欢迎在github issues里提问