Skip to content

fegos/fego-rn

Folders and files

NameName
Last commit message
Last commit date

Latest commit

d7ccc90 · Apr 18, 2018
Dec 21, 2017
Apr 9, 2018
Apr 18, 2018
Mar 30, 2018
Mar 7, 2018
Feb 28, 2018
Feb 6, 2018
Mar 7, 2018
Mar 23, 2018
Mar 9, 2018
Dec 26, 2017
Dec 28, 2017
Apr 4, 2018
Feb 8, 2018
Jan 3, 2018
Feb 24, 2018
Mar 20, 2018

Repository files navigation

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。

欢迎贡献

有任何疑问或问题欢迎在github issues里提问