init project

.gitignore

 .DS_Store
 node_modules
 *.log
+package-lock.json
 explorations
 TODOs.md
 dist/*.gz
@@ -16,3 +17,4 @@ packages/vue-server-renderer/build.js
 packages/vue-server-renderer/server-plugin.js
 packages/vue-server-renderer/client-plugin.js
 packages/vue-template-compiler/build.js
+.vscode/

LICENSE

 The MIT License (MIT)
 
-Copyright (c) 2013-present, Yuxi (Evan) You
+Copyright (c) 2018-present, 美团点评
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.
+THE SOFTWARE.
\ No newline at end of file

README.md

-<p align="center"><a href="https://vuejs.org" target="_blank"><img width="100"src="https://vuejs.org/images/logo.png"></a></p>
-
-<p align="center">
-  <a href="https://circleci.com/gh/vuejs/vue/tree/dev"><img src="https://img.shields.io/circleci/project/vuejs/vue/dev.svg" alt="Build Status"></a>
-  <a href="https://codecov.io/github/vuejs/vue?branch=dev"><img src="https://img.shields.io/codecov/c/github/vuejs/vue/dev.svg" alt="Coverage Status"></a>
-  <a href="https://www.npmjs.com/package/vue"><img src="https://img.shields.io/npm/dm/vue.svg" alt="Downloads"></a>
-  <a href="https://www.npmjs.com/package/vue"><img src="https://img.shields.io/npm/v/vue.svg" alt="Version"></a>
-  <a href="https://www.npmjs.com/package/vue"><img src="https://img.shields.io/npm/l/vue.svg" alt="License"></a>
-  <a href="https://chat.vuejs.org/"><img src="https://img.shields.io/badge/chat-on%20discord-7289da.svg" alt="Chat">
-  <br>
-  <a href="https://saucelabs.com/u/vuejs"><img src="https://saucelabs.com/browser-matrix/vuejs.svg" alt="Sauce Test Status"></a>
-</p>
-
-## Supporting Vue.js
-
-Vue.js is an MIT-licensed open source project. Its ongoing development is made possible thanks to the support by these awesome [backers](https://github.com/vuejs/vue/blob/dev/BACKERS.md). If you'd like to join them, check out [Vue.js' Patreon campaign](https://www.patreon.com/evanyou).
-
-<p align="center">
-  <b>Special thanks to the generous sponsorship by:</b>
-  <br><br>
-  <a href="https://stdlib.com">
-    <img width="240px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/stdlib.png">
-  </a>
-  <br><br>
-  <a href="https://www.upyun.com/?utm_source=vue&utm_medium=ad&utm_content=github">
-    <img width="160px" src="https://raw.githubusercontent.com/vuejs/cn.vuejs.org/master/themes/vue/source/images/upyun-small.png">
-  </a>
-  <br><br>
-  <a href="https://deepstreamhub.com" target="_blank">
-    <img width="140px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/deepstream.png">
-  </a>
-  <br><br>
-  <a href="https://jsfiddle.net/">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/jsfiddle.png">
-  </a>
-  <br><br>
-  <a href="https://laravel.com/">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/laravel.png">
-  </a>
-  <br><br>
-  <a href="https://chaitin.cn/">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/chaitin.png">
-  </a>
-  <br><br>
-  <a href="https://htmlburger.com/">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/htmlburger.png">
-  </a>
-  <br><br>
-  <a href="https://starter.someline.com/">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/someline.png">
-  </a>
-  <br><br>
-  <a href="http://monterail.com/" target="_blank">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/monterail.png">
-  </a>
-  <br><br>
-  <a href="https://www.trisoft.ro/" target="_blank">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/trisoft.png">
-  </a>
-  <br><br>
-  <a href="https://www.2mhost.com/" target="_blank">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/2mhost.png">
-  </a>
-  <br><br>
-  <a href="https://vuejsjob.com/?ref=vuejs" target="_blank">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/vuejobs.png">
-  </a>
-  <br><br>
-  <a href="https://leanpub.com/vuejs2" target="_blank">
-    <img width="120px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/tmvuejs2.png">
-  </a>
-  <br><br>
-  <a href="https://famebroker.com" target="_blank">
-    <img width="130px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/famebroker.png">
-  </a>
-  <br><br>
-  <a href="https://component.io/" target="_blank">
-    <img width="130px" src="https://raw.githubusercontent.com/vuejs/vuejs.org/master/themes/vue/source/images/component_io.png">
-  </a>
-</p>
-
-## Intro
-
-Vue.js is a library for building interactive web interfaces. It provides data-reactive components with a simple and flexible API. Core features include:
-
-- [Declarative rendering with a plain JavaScript object based reactivity system](https://vuejs.org/guide/index.html#Declarative-Rendering)
-- [Component-oriented development style with tooling support](https://vuejs.org/guide/index.html#Composing-with-Components)
-- Lean and extensible core
-- [Flexible transition effect system](https://vuejs.org/guide/transitions.html)
-- Fast without the need for complex optimization
-
-Note that Vue.js only supports [ES5-compliant browsers](http://kangax.github.io/compat-table/es5/) (IE8 and below are not supported).
-
-## Documentation
-
-To check out live examples and docs, visit [vuejs.org](https://vuejs.org).
-
-## Questions
-
-For questions and support please use the [the official forum](http://forum.vuejs.org) or [community chat](https://chat.vuejs.org/). The issue list of this repo is **exclusively** for bug reports and feature requests.
-
-## Issues
-
-Please make sure to read the [Issue Reporting Checklist](https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#issue-reporting-guidelines) before opening an issue. Issues not conforming to the guidelines may be closed immediately.
-
-## Contribution
-
-Please make sure to read the [Contributing Guide](https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md) before making a pull request. If you have a Vue-related project/component/tool, add it with a pull-request to [this curated list](https://github.com/vuejs/awesome-vue)!
-
-## Changelog
-
-Details changes for each release are documented in the [release notes](https://github.com/vuejs/vue/releases).
-
-## Stay In Touch
-
-For the latest releases and announcements, follow on Twitter: [@vuejs](https://twitter.com/vuejs)
-
-## License
-
-[MIT](http://opensource.org/licenses/MIT)
-
-Copyright (c) 2013-present, Yuxi (Evan) You
+# mpvue
+> Vue.js in mini program
+
+<img src="http://mpvue.com/assets/logo.png" width="80">
+
+`mpvue` 是一个使用 [Vue.js](https://vuejs.org) 开发小程序的前端框架。框架基于 `Vue.js` 核心，`mpvue` 修改了 `Vue.js` 的 [runtime](http://mpvue.com/mpvue) 和 [compiler](http://mpvue.com/mpvue-template-compiler) 实现，使其可以运行在小程序环境中，从而为小程序开发引入了整套 `Vue.js` 开发体验。
+
+## 实践案例
+
+美团旗下小程序：`美团汽车票` 和 `美团充电`，此外，正有一大批小程序正在接入中。
+
+## 快速开始
+
+我们精心准备了一个简单的 [五分钟上手教程](http://mpvue.com/mpvue/quickstart) 方便你快速体验到 `mpvue` 带来的开发乐趣。
+
+## 名称由来
+- `mp`：mini program 的缩写
+- `mpvue`：Vue.js in mini program
+
+## 主要特性
+使用 `mpvue` 开发小程序，你将在小程序技术体系的基础上获取到这样一些能力：
+
+- 彻底的组件化开发能力：提高代码
+- 完整的 `Vue.js` 开发体验
+- 方便的 `Vuex` 数据管理方案：方便构建复杂应用
+- 快捷的 `webpack` 构建机制：自定义构建策略、开发阶段 hotReload
+- 支持使用 npm 外部依赖
+- 使用 `Vue.js` 命令行工具 vue-cli 快速初始化项目
+- H5 代码转换编译成小程序目标代码的能力
+
+其它特性正在等着你去探索。
+
+### H5 和小程序如何复用代码
+先来看一段视频：
+<video src="http://mpvue.com/assets/20170810-022809-HD.mp4" width="863" height="480" controls="controls"></video>
+
+在左侧为已经上线的 H5 页面，右侧为同代码的小程序页面，其中只需要更改小部分平台差异代码和更新下 webpack 的建构配置就可以直接运行。
+
+在未来最理想的状态是，可以一套代码可以直接跑在多端：WEB、小程序（微信和支付宝）、Native（借助weex）。
+
+当然从产品的层面，我们不建议这么做，各个端有自己的差异性，我们期望的只是开发和调试体验一致。
+
+## 配套设施
+`mpvue` 作为小程序版本的 `Vue.js`，在框架 SDK 之外，完整的技术体系还包括如下设施。
+
+- [mpvue-loader](http://mpvue.com/build/mpvue-loader) 提供 webpack 版本的加载器
+- [mpvue-webpack-target](http://mpvue.com/build/mpvue-webpack-target) webpack 构建目标
+- [postcss-mpvue-wxss](http://mpvue.com/build/postcss-mpvue-wxss) 样式代码转换预处理工具
+- [px2rpx-loader](http://mpvue.com/build/px2rpx-loader) 样式转化插件
+- 其它
+
+

build/alias.js

@@ -7,6 +7,7 @@ module.exports = {
   shared: path.resolve(__dirname, '../src/shared'),
   web: path.resolve(__dirname, '../src/platforms/web'),
   weex: path.resolve(__dirname, '../src/platforms/weex'),
+  mp: path.resolve(__dirname, '../src/platforms/mp'),
   server: path.resolve(__dirname, '../src/server'),
   entries: path.resolve(__dirname, '../src/entries'),
   sfc: path.resolve(__dirname, '../src/sfc')

build/build.js

@@ -14,7 +14,9 @@ let builds = require('./config').getAllBuilds()
 if (process.argv[2]) {
   const filters = process.argv[2].split(',')
   builds = builds.filter(b => {
-    return filters.some(f => b.dest.indexOf(f) > -1)
+    // fix the project name === floder name
+    // return filters.some(f => b.dest.indexOf(f) > -1)
+    return filters.some(f => b.dest.slice(path.resolve(__dirname, '../').length).indexOf(f) > -1)
   })
 } else {
   // filter out weex builds by default

build/config.js

@@ -7,6 +7,7 @@ const node = require('rollup-plugin-node-resolve')
 const flow = require('rollup-plugin-flow-no-whitespace')
 const version = process.env.VERSION || require('../package.json').version
 const weexVersion = process.env.WEEX_VERSION || require('../packages/weex-vue-framework/package.json').version
+const mpVueVersion = process.env.MP_VUE_VERSION || require('../packages/mpvue/package.json').version
 
 const banner =
   '/*!\n' +
@@ -15,6 +16,8 @@ const banner =
   ' * Released under the MIT License.\n' +
   ' */'
 
+const { mpBanner, mpLifecycleHooks } = require('../src/platforms/mp/join-code-in-build')
+
 const weexFactoryPlugin = {
   intro () {
     return 'module.exports = function weexFactory (exports, renderer) {'
@@ -156,6 +159,24 @@ const builds = {
     dest: resolve('packages/weex-template-compiler/build.js'),
     format: 'cjs',
     external: Object.keys(require('../packages/weex-template-compiler/package.json').dependencies)
+  },
+  // Runtime only (ES Modules). Used by bundlers that support ES Modules,
+  // e.g. Rollup & Webpack 2
+  'mpvue': {
+    mp: true,
+    entry: resolve('mp/entry-runtime.js'),
+    dest: resolve('packages/mpvue/index.js'),
+    format: 'umd',
+    env: 'production',
+    banner: mpBanner
+  },
+  // MP compiler (CommonJS). Used by mpvue's Webpack loader.
+  'mpvue-template-compiler': {
+    mp: true,
+    entry: resolve('mp/entry-compiler.js'),
+    dest: resolve('packages/mpvue-template-compiler/build.js'),
+    format: 'cjs',
+    external: Object.keys(require('../packages/mpvue-template-compiler/package.json').dependencies)
   }
 }
 
@@ -171,7 +192,7 @@ function genConfig (opts) {
       replace({
         __WEEX__: !!opts.weex,
         __WEEX_VERSION__: weexVersion,
-        __VERSION__: version
+        __VERSION__: opts.mp ? mpVueVersion : version
       }),
       flow(),
       buble(),
@@ -185,6 +206,16 @@ function genConfig (opts) {
     }))
   }
 
+  // hack fix MP LIFECYCLE_HOOKS
+  if (opts.mp) {
+    config.plugins.push(replace({
+      "'deactivated'\n]": `'deactivated', ${mpLifecycleHooks}\n]`
+    }))
+    config.plugins.push(replace({
+      'inBrowser && window.navigator.userAgent.toLowerCase': `['mpvue-runtime'].join`
+    }))
+  }
+
   return config
 }
 

dist/vue.common.js

 /*!
  * Vue.js v2.4.1
- * (c) 2014-2017 Evan You
+ * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
 'use strict';
@@ -3498,6 +3498,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

dist/vue.esm.js

 /*!
  * Vue.js v2.4.1
- * (c) 2014-2017 Evan You
+ * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
 /*  */
@@ -3496,6 +3496,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

dist/vue.js

 /*!
  * Vue.js v2.4.1
- * (c) 2014-2017 Evan You
+ * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
 (function (global, factory) {
@@ -3494,6 +3494,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

dist/vue.runtime.common.js

 /*!
  * Vue.js v2.4.1
- * (c) 2014-2017 Evan You
+ * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
 'use strict';
@@ -3494,6 +3494,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

dist/vue.runtime.esm.js

 /*!
  * Vue.js v2.4.1
- * (c) 2014-2017 Evan You
+ * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
 /*  */
@@ -3492,6 +3492,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

dist/vue.runtime.js

 /*!
  * Vue.js v2.4.1
- * (c) 2014-2017 Evan You
+ * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
 (function (global, factory) {
@@ -3490,6 +3490,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

package.json

 {
   "name": "vue",
-  "version": "2.4.1",
-  "description": "Reactive, component-oriented view layer for modern web interfaces.",
+  "version": "1.0.0",
+  "description": "Vue.js in mini program",
   "main": "dist/vue.runtime.common.js",
   "module": "dist/vue.runtime.esm.js",
   "unpkg": "dist/vue.js",
@@ -19,14 +19,18 @@
     "dev:compiler": "rollup -w -c build/config.js --environment TARGET:web-compiler ",
     "dev:weex": "rollup -w -c build/config.js --environment TARGET:weex-framework ",
     "dev:weex:compiler": "rollup -w -c build/config.js --environment TARGET:weex-compiler ",
+    "dev:mpvue": "rollup -w -c build/config.js --environment TARGET:mpvue ",
+    "dev:mpvue:compiler": "rollup -w -c build/config.js --environment TARGET:mpvue-template-compiler ",
     "build": "node build/build.js",
     "build:ssr": "npm run build -- vue.runtime.common.js,vue-server-renderer",
     "build:weex": "npm run build -- weex-vue-framework,weex-template-compiler",
-    "test": "npm run lint && flow check && npm run test:types && npm run test:cover && npm run test:e2e -- --env phantomjs && npm run test:ssr && npm run test:weex",
+    "build:mpvue": "npm run build -- mpvue,mpvue-template-compiler",
+    "test": "npm run lint && flow check && npm run test:types && npm run test:cover && npm run test:e2e -- --env phantomjs && npm run test:ssr && npm run test:weex && npm run test:mpvue",
     "test:unit": "karma start test/unit/karma.unit.config.js",
     "test:cover": "karma start test/unit/karma.cover.config.js",
     "test:e2e": "npm run build -- vue.min.js && node test/e2e/runner.js",
     "test:weex": "npm run build:weex && jasmine JASMINE_CONFIG_PATH=test/weex/jasmine.json",
+    "test:mpvue": "npm run build:mpvue && jasmine JASMINE_CONFIG_PATH=test/mp/jasmine.json",
     "test:ssr": "npm run build:ssr && jasmine JASMINE_CONFIG_PATH=test/ssr/jasmine.json",
     "test:sauce": "npm run sauce -- 0 && npm run sauce -- 1 && npm run sauce -- 2",
     "test:types": "tsc -p ./types/test/tsconfig.json",
@@ -42,17 +46,25 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/vuejs/vue.git"
+    "url": "git+https://github.com/Meituan-Dianping/mpvue.git"
   },
   "keywords": [
     "vue"
   ],
-  "author": "Evan You",
+  "author": "anchengjian",
+  "contributors": [
+    {
+      "name" : "hucq"
+    },
+    {
+      "name" : "aOrz"
+    }
+  ],
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/vuejs/vue/issues"
+    "url": "https://github.com/Meituan-Dianping/mpvue/issues"
   },
-  "homepage": "https://github.com/vuejs/vue#readme",
+  "homepage": "https://github.com/Meituan-Dianping/mpvue",
   "devDependencies": {
     "babel-core": "^6.25.0",
     "babel-eslint": "^7.2.3",

packages/mpvue-template-compiler/README.md

+# mpvue-template-compiler
+
+> This package is auto-generated. For pull requests please see [src/platforms/mp/entry-compiler.js](https://github.com/Meituan-Dianping/mpvue/blob/master/src/platforms/mp/entry-compiler.js).

packages/mpvue-template-compiler/index.js

+try {
+  var vueVersion = require('mpvue/package.json').version
+} catch (e) {}
+
+var packageName = require('./package.json').name
+var packageVersion = require('./package.json').version
+if (vueVersion && vueVersion !== packageVersion) {
+  throw new Error(
+    '\n\nVue packages version mismatch:\n\n' +
+    '- vue@' + vueVersion + '\n' +
+    '- ' + packageName + '@' + packageVersion + '\n\n' +
+    'This may cause things to work incorrectly. Make sure to use the same version for both.\n' +
+    'If you are using mpvue-loader, re-installing them should bump ' + packageName + ' to the latest.\n'
+  )
+}
+
+module.exports = require('./build')

packages/mpvue-template-compiler/package.json

+{
+  "name": "mpvue-template-compiler",
+  "version": "1.0.0",
+  "description": "mpvue template compiler for Vue",
+  "main": "index.js",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Meituan-Dianping/mpvue.git"
+  },
+  "keywords": [
+    "vue",
+    "compiler",
+    "mp",
+    "mp",
+    "antmp"
+  ],
+  "author": "meituan.com",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/Meituan-Dianping/mpvue/issues"
+  },
+  "homepage": "https://github.com/Meituan-Dianping/mpvue/",
+  "dependencies": {
+    "he": "^1.1.0",
+    "de-indent": "^1.0.2"
+  }
+}

packages/mpvue/README.md

+# mpvue
+
+> This package is auto-generated. For pull requests please see [src/platforms/mp/entry-runtime.js](https://github.com/Meituan-Dianping/mpvue/blob/master/src/platforms/mp/entry-runtime.js).

packages/mpvue/package.json

+{
+  "name": "mpvue",
+  "version": "1.0.0",
+  "description": "Vue Runtime for mini program",
+  "main": "index.js",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Meituan-Dianping/mpvue.git"
+  },
+  "keywords": [
+    "vue",
+    "compiler",
+    "mp",
+    "mp",
+    "antmp"
+  ],
+  "author": "meituan.com",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/Meituan-Dianping/mpvue/issues"
+  },
+  "homepage": "https://github.com/Meituan-Dianping/mpvue/"
+}

packages/vue-server-renderer/basic.js

@@ -6914,6 +6914,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

packages/vue-server-renderer/build.js

@@ -6657,6 +6657,7 @@ var componentVNodeHooks = {
   insert: function insert (vnode) {
     var context = vnode.context;
     var componentInstance = vnode.componentInstance;
+
     if (!componentInstance._isMounted) {
       componentInstance._isMounted = true;
       callHook(componentInstance, 'mounted');

packages/weex-vue-framework/index.js

@@ -34,7 +34,7 @@ function init (cfg) {
   renderer.Document = cfg.Document;
   renderer.Element = cfg.Element;
   renderer.Comment = cfg.Comment;
-  renderer.sendTasks = cfg.sendTasks;
+  renderer.compileBundle = cfg.compileBundle;
 }
 
 /**
@@ -47,7 +47,7 @@ function reset () {
   delete renderer.Document;
   delete renderer.Element;
   delete renderer.Comment;
-  delete renderer.sendTasks;
+  delete renderer.compileBundle;
 }
 
 /**
@@ -82,18 +82,9 @@ function createInstance (
   // Virtual-DOM object.
   var document = new renderer.Document(instanceId, config.bundleUrl);
 
-  // All function/callback of parameters before sent to native
-  // will be converted as an id. So `callbacks` is used to store
-  // these real functions. When a callback invoked and won't be
-  // called again, it should be removed from here automatically.
-  var callbacks = [];
-
-  // The latest callback id, incremental.
-  var callbackId = 1;
-
   var instance = instances[instanceId] = {
     instanceId: instanceId, config: config, data: data,
-    document: document, callbacks: callbacks, callbackId: callbackId
+    document: document
   };
 
   // Prepare native module getter and HTML5 Timer APIs.
@@ -104,6 +95,7 @@ function createInstance (
   var weexInstanceVar = {
     config: config,
     document: document,
+    supports: supports,
     requireModule: moduleGetter
   };
   Object.freeze(weexInstanceVar);
@@ -118,11 +110,16 @@ function createInstance (
     weex: weexInstanceVar,
     // deprecated
     __weex_require_module__: weexInstanceVar.requireModule // eslint-disable-line
-  }, timerAPIs);
-  callFunction(instanceVars, appCode);
+  }, timerAPIs, env.services);
+
+  if (!callFunctionNative(instanceVars, appCode)) {
+    // If failed to compile functionBody on native side,
+    // fallback to 'callFunction()'.
+    callFunction(instanceVars, appCode);
+  }
 
   // Send `createFinish` signal to native.
-  renderer.sendTasks(instanceId + '', [{ module: 'dom', method: 'createFinish', args: [] }], -1);
+  instance.document.taskCenter.send('dom', { action: 'createFinish' }, []);
 }