直接使用 Libraries/ 而非 babel 转换过的 lib/

.npmignore

@@ -41,4 +41,3 @@ npm-debug.log
 pages
 react-web-cli
 Examples
-Libraries

Libraries/Image/Image.web.js

@@ -20,6 +20,35 @@ class Image extends Component {
     isInAParentText: React.PropTypes.bool
   }
 
+  static getSize = function(
+    url: string,
+    success: (width: number, height: number) => void,
+    failure: (error: any) => void,
+  ) {
+    let wrap = document.createElement('div'),
+      img = new window.Image(),
+      loadedHandler = function loadedHandler() {
+        img.removeEventListener('load', loadedHandler);
+        success && success(img.offsetWidth, img.offsetHeight);
+      },
+      errorHandler = function errorHandler() {
+        img.removeEventListener('error', errorHandler);
+        failure && failure();
+      };
+
+    wrap.style.cssText = 'height:0px;width:0px;overflow:hidden;visibility:hidden;';
+
+    wrap.appendChild(img);
+    document.body.appendChild(wrap);
+    img.src = url;
+    if (!img.complete) {
+      img.addEventListener('error', errorHandler);
+      img.addEventListener('load', loadedHandler);
+    } else {
+      loadedHandler();
+    }
+  }
+
   render() {
 
     let props = {...this.props};

Libraries/LayoutAnimation/LayoutAnimation.web.js

@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) 2015-present, Alibaba Group Holding Limited.
+ * All rights reserved.
+ *
+ * Copyright (c) 2015, Facebook, Inc.  All rights reserved.
+ *
+ * @providesModule ReactLayoutAnimation
+ */
+"use strict";
+
+var LayoutAnimation = {
+  Types: {},
+  Properties: {},
+  configureNext: function configureNext() {}
+};
+
+module.exports = LayoutAnimation;

Libraries/RefreshControl/RefreshControl.web.js

@@ -1,9 +1,9 @@
 /**
  * Copyright (c) 2015-present, Alibaba Group Holding Limited.
  * All rights reserved.
- * Copyright (c) 2015-present, Facebook, Inc.
- * All rights reserved.
- 8
+ *
+ * Copyright (c) 2015, Facebook, Inc.  All rights reserved.
+ *
  * @providesModule ReactRefreshControl
  */
 'use strict';
@@ -18,7 +18,7 @@ let RefreshLayoutConsts = {SIZE: {}};
 
 class RefreshControl extends Component {
 
-  static SIZE = RefreshLayoutConsts.SIZE,
+  static SIZE = RefreshLayoutConsts.SIZE
 
   componentDidMount() {
     this._lastNativeRefreshing = this.props.refreshing;
@@ -45,7 +45,7 @@ class RefreshControl extends Component {
         onRefresh={this._onRefresh}
       />
     );
-  },
+  }
 
   _onRefresh() {
     this._lastNativeRefreshing = true;
@@ -55,8 +55,8 @@ class RefreshControl extends Component {
     // The native component will start refreshing so force an update to
     // make sure it stays in sync with the js component.
     this.forceUpdate();
-  },
-});
+  }
+}
 
 mixin.onClass(RefreshControl, NativeMethodsMixin);
 autobind(RefreshControl);

Libraries/Touchable/TouchableHighlight.web.js

@@ -126,12 +126,16 @@ class TouchableHighlight extends Component {
     this._showUnderlay();
     this._hideTimeout = this.setTimeout(this._hideUnderlay,
       this.props.delayPressOut || 100);
-      
+
     var touchBank = e.touchHistory.touchBank[e.touchHistory.indexOfSingleActiveTouch];
-    var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2) 
-      + Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
-    var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
-    if (velocity < 100) this.props.onPress && this.props.onPress(e);
+    if (touchBank) {
+      var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+          + Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
+      var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
+      if (velocity < 100) this.props.onPress && this.props.onPress(e);
+    } else {
+      this.props.onPress && this.props.onPress(e);
+    }
   }
 
   touchableHandleLongPress(e: Event) {

Libraries/Touchable/TouchableOpacity.web.js

@@ -107,12 +107,16 @@ class TouchableOpacity extends React.Component {
       this._opacityInactive,
       this.props.delayPressOut || 100
     );
-    
+
     var touchBank = e.touchHistory.touchBank[e.touchHistory.indexOfSingleActiveTouch];
-    var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
-        + Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
-    var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
-    if (velocity < 100) this.props.onPress && this.props.onPress(e);
+    if (touchBank) {
+      var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+          + Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
+      var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
+      if (velocity < 100) this.props.onPress && this.props.onPress(e);
+    } else {
+      this.props.onPress && this.props.onPress(e);
+    }
   }
 
   touchableHandleLongPress(e: Event) {

Libraries/Touchable/TouchableWithoutFeedback.web.js

@@ -76,10 +76,14 @@ class TouchableWithoutFeedback extends Component {
    */
   touchableHandlePress(e: Event) {
     var touchBank = e.touchHistory.touchBank[e.touchHistory.indexOfSingleActiveTouch];
-    var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
-        + Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
-    var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
-    if (velocity < 100) this.props.onPress && this.props.onPress(e);
+    if (touchBank) {
+      var offset = Math.sqrt(Math.pow(touchBank.startPageX - touchBank.currentPageX, 2)
+          + Math.pow(touchBank.startPageY - touchBank.currentPageY, 2));
+      var velocity = (offset / (touchBank.currentTimeStamp - touchBank.startTimeStamp)) * 1000;
+      if (velocity < 100) this.props.onPress && this.props.onPress(e);
+    } else {
+      this.props.onPress && this.props.onPress(e);
+    }
   }
 
   touchableHandleActivePressIn(e: Event) {

Libraries/react-web.js

@@ -17,6 +17,7 @@ export * from 'react';
 
 // Components
 export ActivityIndicatorIOS from 'ReactActivityIndicator';
+export ActivityIndicator from 'ReactActivityIndicator';
 // export DatePicker from 'ReactDatePicker';
 export DrawerLayoutAndroid from 'ReactDrawerLayout';
 export Image from 'ReactImage';
@@ -42,7 +43,7 @@ export TouchableHighlight from 'ReactTouchableHighlight';
 export TouchableOpacity from 'ReactTouchableOpacity';
 export TouchableWithoutFeedback from 'ReactTouchableWithoutFeedback';
 export TouchableBounce from 'ReactTouchableBounce';
-// export RefreshControl from 'ReactRefreshControl';
+export RefreshControl from 'ReactRefreshControl';
 export View from 'ReactView';
 export ViewPagerAndroid from 'ReactViewPager';
 export ViewPager from 'ReactViewPager';
@@ -57,6 +58,7 @@ export AsyncStorage from 'ReactAsyncStorage';
 export Dimensions from 'ReactDimensions';
 export Easing from 'animated/lib/Easing';
 export InteractionManager from 'ReactInteractionManager';
+export LayoutAnimation from 'ReactLayoutAnimation';
 export PanResponder from 'ReactPanResponder';
 export PixelRatio from 'ReactPixelRatio';
 export StyleSheet from 'ReactStyleSheet';

README-zh.md

@@ -16,7 +16,7 @@
 ## 安装
 
 ```
-npm install react-web --save
+npm install --save git+https://github.com/taobaofed/react-web.git
 ```
 
 ## 使用

README.md

@@ -27,7 +27,7 @@ If you already have a React Native project and want to add web support, you need
 1. Install `npm install react-web-cli -g`
 2. Execute `react-web init <ExistedProjectDir>`. That install `react-web` and `devDependencies` to your project and make a `web` directory with `webpack.config.js` file under your project
 3. Register your app into a web platform. To do so, add the code from **Fix platform differences. 2. Should run application on web platform** to your index.ios.js file
-4. Execute `npm start`
+4. Execute `npm install --save git+https://github.com/taobaofed/react-web.git` that replace react-web npm version to develope react-web itself easier
 5. Execute `react-web start` that starts the web dev server
 6. Execute `react-web bundle` that builds the output
 
@@ -36,7 +36,7 @@ If you already have a React Native project and want to add web support, you need
 ### Install
 
 ```sh
-npm install react-web --save
+npm install --save git+https://github.com/taobaofed/react-web.git
 ```
 
 ### Add Webpack configuration
@@ -163,6 +163,7 @@ As mentioned above, the HasteResolverPlugin plugin will help webpack to compile
 #### Components
 
 * ActivityIndicatorIOS - ReactActivityIndicator
+* ActivityIndicator - ReactActivityIndicator
 * DatePickerIOS - ReactDatePicker *TODO*
 * DrawerLayoutAndroid - ReactDrawerLayout
 * Image - ReactImage
@@ -177,6 +178,7 @@ As mentioned above, the HasteResolverPlugin plugin will help webpack to compile
 * Switch - ReactSwitch
 * SwitchAndroid - ReactSwitch
 * SwitchIOS - ReactSwitch
+* RefreshControl - ReactRefreshControl
 * TabBarIOS - ReactTabBar
 * Text - ReactText
 * TextInput - ReactTextInput
@@ -198,6 +200,7 @@ As mentioned above, the HasteResolverPlugin plugin will help webpack to compile
 * Dimensions - ReactDimensions
 * Easing - ReactEasing
 * InteractionManager - ReactInteractionManager
+* LayoutAnimation - ReactLayoutAnimation
 * PanResponder - ReactPanResponder
 * PixelRatio - ReactPixelRatio
 * StyleSheet - ReactStyleSheet

local-cli/generator-web/templates/webpack.config.js

@@ -23,7 +23,7 @@ var config = {
 var webpackConfig = {
   ip: IP,
   port: PORT,
-  devtool: 'source-map',
+  devtool: 'cheap-module-eval-source-map',
   resolve: {
     alias: {
       'react-native': 'ReactWeb',
@@ -73,7 +73,7 @@ var webpackConfig = {
         presets: ['es2015', 'react', 'stage-1']
       },
       include: [config.paths.src],
-      exclude: [/node_modules/]
+      exclude: /(node_modules\/(?!react))/
     }]
   }
 };

package.json

@@ -7,7 +7,7 @@
     "type": "git",
     "url": "git@github.com:taobaofed/react-web.git"
   },
-  "main": "./lib/react-web.js",
+  "main": "./Libraries/react-web.js",
   "keywords": [
     "react-native",
     "react-web",