+ [html5] add render built with weex-vue-bundle-tool.

.gitignore

@@ -39,6 +39,9 @@ examples/vue/test/
 html5/browser/extend/packer.js
 html5/render/browser/extend/packer.js
 
+# Created by weex-vue-bundle-util
+weex-vue-plugins.js
+
 android/playground/app/gradlew
 android/playground/app/gradlew.bat
 android/playground/app/gradle/wrapper/gradle-wrapper.jar

build/build.js

@@ -24,6 +24,10 @@ const gzip = require('zlib').createGzip()
 const pkg = require('../package.json')
 const rollup = require('rollup')
 const watch = require('rollup-watch')
+const webpack = require('webpack')
+const scan = require('weex-vue-bundle-util')
+const webExamplesWebpackConfig = require('./webpack.examples.web.config')
+const exec = require('child_process').execSync
 
 const getConfig = require('./config')
 
@@ -111,6 +115,55 @@ function getAllEntries (rootDir) {
     })
 }
 
+function absolutePath (p) {
+  return path.join(__dirname, p)
+}
+
+function buildForWebExamples (config, minifyConfig) {
+  config.entry = minifyConfig.entry = absolutePath('../entry.js')
+  config.dest = absolutePath('../dist/render.vue.js')
+  delete config.banner
+  config.plugins = config.plugins.filter(function (plugin) {
+    return plugin.name !== 'eslint'
+  })
+  minifyConfig.dest = absolutePath('../dist/render.vue.min.js')
+  delete minifyConfig.banner
+
+  // bundle web examples.
+  scan(webpack, webExamplesWebpackConfig)
+    .then(function (res) {
+      var pkgs = res.pkgs
+      var names = []
+      var str = pkgs.map(function (pkgName) {
+        var name = pkgName
+          .replace('weex-vue-', '')
+          .replace(/-(\w)/g, function ($0, $1) {
+            return $1.toUpperCase()
+          })
+          + 'Mod'
+        names.push(name)
+        try {
+          var version = require(`${pkgName}/package.json`).version
+        } catch (err) {
+          exec(`npm install ${pkgName}`)
+        }
+        return `import ${name} from '${pkgName}'\n`
+      }).join('')
+      str += `export default [\n${names.join(',  \n')}\n]\n`
+      return fs.writeFileSync(absolutePath('../weex-vue-plugins.js'), str)
+    })
+    .then(function () {
+      console.log(`\n => start to build weex-vue-render for examples.\n`)
+      return new Promise((resolve, reject) => {
+        runRollup(config).then(() => {
+          runRollup(minifyConfig).then(() => {
+            zip(minifyConfig.dest, resolve)
+          })
+        })
+      })
+    })
+}
+
 function build (name) {
   let pkgName = 'weex-js-framework'
   switch (name) {
@@ -120,12 +173,16 @@ function build (name) {
     case 'vue': pkgName = 'weex-vue-render'; break;
     case 'vue-plugins': pkgName = 'weex-vue-render-plugins'; break;
     case 'vue-core': pkgName = 'weex-vue-render-core'; break;
+    case 'web-examples': pkgName = 'weex-vue-render-core'; break;
   }
 
   const config = getConfig(pkgName)
   const minifyConfig = getConfig(pkgName, true)
 
-  if (pkgName === 'weex-vue-render-plugins') {
+  if (name === 'web-examples') {
+    buildForWebExamples(config, minifyConfig)
+  }
+  else if (pkgName === 'weex-vue-render-plugins') {
     // build multiple packages in a loop.
     console.log(`\n => start to build ${name} (${pkgName})\n`)
     const entries = getAllEntries(path.join(__dirname, '../packages/weex-vue-plugins'))

entry.js

@@ -0,0 +1,11 @@
+import weex from './packages/weex-vue-render/dist/index.core'
+import plugins from './weex-vue-plugins'
+
+// install plugins.
+plugins.forEach(function (plugin) {
+  weex.install(plugin)
+})
+
+weex.init()
+
+export default weex

html5/render/vue/README.md

@@ -84,7 +84,7 @@ These components have already integrated into render-core. You don't have to imp
 | weex-vue-geolocation | geolocation |
 | weex-vue-global-event | globalEvent |
 | weex-vue-modal | modal |
-| weex-vue-navigator | navigator |
+| weex-vue-nav | navigator |
 | weex-vue-storage | storage |
 | weex-vue-stream | stream |
 | weex-vue-websocket | websocket |
@@ -94,6 +94,14 @@ Some of the above plugins may not be mentioned in weex documents. Just ignore th
 
 You can develop more plugins for your app. Accordingly the same plugin for other two platforms (iOS and Android) should also be built and intergrated in your app if you want it run on all three platforms.
 
+#### scan your code
+
+Use `weex-vue-bundle-util` to scan you code, which will return a promise with a object to tell which components and modules you have used in your project, so that can generate a entry file accordingly to import those plugins.
+
+https://github.com/weexteam/weex-vue-bundle-util
+
+You can see the examples of weex built in this way by running the script `npm run build:vue:examples`, and use the `<script src="./dist/render.vue.js"></script>` as the render in the `vue.html` file.
+
 ## use vue-loader to bundle .vue file
 
 NOTE: you should inject `$processStyle` to preprocess vnode's style in vue-loader's postTransformNode hook.

package.json

@@ -47,6 +47,7 @@
     "build:vue": "flow check && node build/build.js vue && npm run build:vue:core && npm run build:vue:plugins",
     "build:vue:core": "node build/build.js vue-core",
     "build:vue:plugins": "node build/build.js vue-plugins",
+    "build:vue:examples": "node build/build.js web-examples",
     "build:examples": "npm run build:examples:native && npm run build:examples:web",
     "build:examples:native": "webpack --config build/webpack.examples.config.js",
     "build:examples:web": "webpack --config build/webpack.examples.web.config.js",

vue.html

@@ -46,10 +46,12 @@
   </style>
 
   <!--<script src="./node_modules/vue/dist/vue.runtime.min.js"></script>-->
-   <script src="./node_modules/vue/dist/vue.runtime.js"></script> 
-   <!--<script src="dist/vue.runtime.js"></script> -->
+  <script src="./node_modules/vue/dist/vue.runtime.js"></script> 
+  <!--<script src="dist/vue.runtime.js"></script> -->
   <!-- <script src="./node_modules/weex-vue-render/index.min.js"></script> -->
-   <script src="./packages/weex-vue-render/dist/index.js"></script> 
+  <script src="./packages/weex-vue-render/dist/index.js"></script>
+  <!--<script src="./dist/render.vue.js"></script>-->
+  <!--<script src="./dist/render.vue.min.js"></script>-->
   <!--<script src="./packages/weex-vue-render/dist/index.min.js"></script>-->
 </head>
 <body>