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里提问