react-navigation-antd

react-native

node4+ npm3+

npm i react-native-cli -g
npm i
npm start

react-native run-ios // ios
react-native run-android // android

use antd-mobile in react-native project

1. install dep

$ npm install antd-mobile --save
$ npm install babel-plugin-import --save-dev

2. config .babelrc

{"plugins": [["import", { "libraryName": "antd-mobile" }]]}

Application Architecture

• Microsoft Code Push for dynamic update.
• Redux is a predictable state container for reading application, together with React Native.
• Redux-Saga is a library that aims to make side effects in reading application easier and better.
• react-navigation is an extensible yet easy-to-use navigation solution, can also be used across React and React Native projects allowing for a higher degree of shared code.
• Jest for testing React Native components and UT.
• Eslint is a tool for identifying and reporting on patterns found in reading application code.
• react-native-exceptions-manager for handling crashes in release version.

use eslint in react-native

1. init eslint

eslint --init

2. Lint 检查 src/ 以及 更目录 .js文件

npm run lint

3. format

npm run format

Development Workflow

Run Test

npm test

Jest

react-navigation

https://github.com/react-community/react-navigation

react-native-camera

https://github.com/lwansbrough/react-native-camera

react-native-image-picker

https://github.com/react-community/react-native-image-picker

jpush

https://github.com/jpush/jpush-react-native

  npm run configureJPush <yourAppKey> <yourModuleName>

module name 指的是你 Android 项目中的模块名字(对 iOS 没有影响，不填写的话默认值为 app，会影响到查找 AndroidManifest 问题， 如果没找到 AndroidManifest，则需要手动修改，参考下面的 AndroidManifest 配置相关说明) 举个例子:

npm run configureJPush a54d0c2cb761ba030650534a app

todo:

1. react-navigation-slide-from-right-transition 将所有的页面设置为 fromRight,怎么设置某个页面fromButtom
2. 打开拍照速度, 相机加载之前的动画?
3. echarts 打包后不显示图,与rn 48 兼容不好