ReactNativeWeb

• 借用 react-web实现三端（IOS/Android/Web）共用一套逻辑代码（因组件各异，部分代码要分开写），生成原生的IOS/Android应用和Web应用。

• 高级版本入口>> 在这版本基础上加入了 Redux，改用ES6语法。

效果

Web效果地址

因跨域，MAC系统终端输入以下代码，启动Chrome

open -a "Google Chrome" --args --disable-web-security --user-data-dir

然后输入

http://weianzi.github.io/ReactNativeWeb/web/output/index.html

windows下, 请参考：

Chrome浏览器如何设置可以解决Ajax跨域
http://jingyan.baidu.com/article/7c6fb4281d685780642c900a.html

创建Chrome的快捷方式，修改快捷方式的目标为：
"C:\Program Files\Google\Chrome\Application\chrome.exe" --args --disable-web-security --user-data-dir

入口

• Web ：index.web.js
• IOS ：index.ios.js
• Android ：index.android.js

开发系统

• = MAC 10.10.5， >= Xcode 7， Android 6.0 (API 23)

依赖

• node.js: > "4.0.0"
• npm: > "3.0.0"
• babel: "^6.5.2"
• react: "^0.14.7"
• react-dom: "^0.14.7"
• react-native: "^0.20.0"
• react-web: "^0.2.3"
• ...

安装依赖

npm install 

Web版本

开启web服务

npm run web-dev

http://localhost:3000

打包web页面js文件

npm run web-bundle

执行之后会在 web/output 目录下生成静态文件

IOS版本

前提：安装好react native开发环境 官方 中文

用xcode 打开项目 ios/ReactNativeRedux.xcodeproj，然后运行

Android版本

前提：先安装好react native开发环境 官方 中文

进入项目根目录，命令行输入：react-native run-android

提示

先安装好react native和redux，确定ios/android正常运行后，再安装react-web

npm install react-web-cli -g
react-web init <ExistedProjectDir>

安装react native后请删掉/node_modules/react-deep-force-update目录下的.babelrc文件