weex rax interop prototype

yyx990803 · yyx990803 · commit ec2bcf8061e7 · 2017-01-11T10:01:06.000-05:00
diff --git a/package.json b/package.json
@@ -100,6 +100,7 @@
     "nightwatch": "^0.9.9",
     "nightwatch-helpers": "^1.2.0",
     "phantomjs-prebuilt": "^2.1.1",
+    "rax": "^0.1.2",
     "rollup": "^0.36.1",
     "rollup-plugin-alias": "^1.2.0",
     "rollup-plugin-babel": "^2.4.0",
diff --git a/src/platforms/weex/framework.js b/src/platforms/weex/framework.js
@@ -1,5 +1,7 @@
-import Vue from 'weex/runtime/index'
-import renderer from 'weex/runtime/config'
+import Vue from './runtime/index'
+import renderer from './runtime/config'
+import genRaxRequire from './rax-interop/require'
+import genRaxWrapper from './rax-interop/wrap'
 
 Vue.weexVersion = '__WEEX_VERSION__'
 export { Vue }
@@ -107,11 +109,16 @@ export function createInstance (
     subVue[name] = Vue[name]
   })
 
-  // The function which create a closure the JS Bundle will run in.
-  // It will declare some instance variables like `Vue`, HTML5 Timer APIs etc.
+  // rax interop for require('rax')
+  // NOTE: need to config rax as external in Webpack
+  const raxRequire = genRaxRequire(document)
+  // expose wrapRaxComponent
+  subVue.wrapRaxComponent = genRaxWrapper(raxRequire('rax'))
+
   const instanceVars = Object.assign({
     Vue: subVue,
     weex: weexInstanceVar,
+    require: raxRequire,
     __weex_require_module__: weexInstanceVar.requireModule // deprecated
   }, timerAPIs)
   callFunction(instanceVars, appCode)
diff --git a/src/platforms/weex/rax-interop/require.js b/src/platforms/weex/rax-interop/require.js
@@ -0,0 +1,47 @@
+const raxFactory = require('rax/dist/rax.factory')
+
+export default function genRaxRequire (document) {
+  const context = {
+    document,
+    __weex_document__: document
+  }
+
+  const modules = {
+    rax: {
+      factory: raxFactory.bind(context),
+      module: { exports: {}},
+      isInitialized: false
+    }
+  }
+
+  return function require (name) {
+    var mod = modules[name]
+
+    if (mod && mod.isInitialized) {
+      return mod.module.exports
+    }
+
+    if (!mod) {
+      throw new Error(
+        'Requiring unknown module "' + name + '"'
+      )
+    }
+
+    if (mod.hasError) {
+      throw new Error(
+        'Requiring module "' + name + '" which threw an exception'
+      )
+    }
+
+    try {
+      mod.isInitialized = true
+      mod.factory(require, mod.module.exports, mod.module)
+    } catch (e) {
+      mod.hasError = true
+      mod.isInitialized = false
+      throw e
+    }
+
+    return mod.module.exports
+  }
+}
diff --git a/src/platforms/weex/rax-interop/wrap.js b/src/platforms/weex/rax-interop/wrap.js
@@ -0,0 +1,31 @@
+export default function genRaxWrapper (Rax) {
+  const { render, createElement, unmountComponentAtNode } = Rax
+
+  return function wrapRaxComponent (RaxComponent) {
+    return {
+      created () {
+        const update = this._updateFromParent
+        this._updateFromParent = function () {
+          update.apply(this, arguments)
+          this.renderRaxComponent()
+        }
+      },
+      render (h) {
+        return h('div')
+      },
+      mounted () {
+        this.renderRaxComponent()
+      },
+      beforeDestroy () {
+        unmountComponentAtNode(this.$el)
+      },
+      methods: {
+        renderRaxComponent () {
+          const data = this.$vnode.data
+          const props = Object.assign({}, data.attrs, data.domProps, data.props)
+          render(createElement(RaxComponent, props), this.$el)
+        }
+      }
+    }
+  }
+}
