[html5] extract render core and plugins from full verison.

.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,9 @@ 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 exec = require('child_process').execSync
 
 const getConfig = require('./config')
 
@@ -45,6 +48,17 @@ else {
   console.log('\nPlease specify the package you want to build. [native, runtime, browser, vue]')
 }
 
+function extend(to, ...froms) {
+  froms.forEach(function (from) {
+    for (const key in from) {
+      if (from.hasOwnProperty(key)) {
+        to[key] = from[key]
+      }
+    }
+  })
+  return to
+}
+
 function runRollupOnWatch(config) {
   const watcher = watch(rollup, config)
   watcher.on('event', event => {
@@ -84,19 +98,108 @@ function runRollup (config) {
   })
 }
 
+function getAllEntries (rootDir) {
+  return fs.readdirSync(rootDir)
+    .filter(function (file) {
+      return fs.statSync(path.join(rootDir, file)).isDirectory()
+    })
+    .map(function (file) {
+      var fullpath = path.join(rootDir, file)
+      var entry = path.join(fullpath, 'src/index.js')
+      var dest = path.join(fullpath, 'dist/index.js')
+      var name = file.replace(/-(\w)/g, function ($0, $1) {
+        return $1.toUpperCase()
+      })
+      return { entry, dest, name }
+    })
+}
+
+function absolutePath (p) {
+  return path.join(__dirname, p)
+}
+
+function buildForWebExamples (config, minifyConfig) {
+  const webExamplesWebpackConfig = require('./webpack.examples.web.config')
+  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) {
     case 'native': pkgName = 'weex-js-framework'; break;
     case 'runtime': pkgName = 'weex-js-runtime'; break;
     case 'browser': pkgName = 'weex-web-render'; break;
     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 (isWatch) {
+  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'))
+    entries.forEach(function (item) {
+      const info = {
+        moduleName: item.name,
+        entry: item.entry
+      }
+      const itemConfig = extend({}, config, info, { dest: item.dest })
+      const itemMinConfig = extend({}, minifyConfig, info, { dest: item.dest.replace(/\.js$/, '.min.js') })
+      runRollup(itemConfig)
+        .then(() => {
+          return runRollup(itemMinConfig)
+        })
+    })
+  }
+  else if (isWatch) {
     return runRollupOnWatch(config)
   }
   else {

build/config.js

@@ -82,11 +82,10 @@ const configs = {
   },
   'weex-vue-render': {
     moduleName: 'WeexVueRender',
-    entry: absolute('html5/render/vue/index.js'),
+    entry: absolute('packages/weex-vue-render/src/index.js'),
     dest: absolute('packages/weex-vue-render/dist/index.js'),
     banner:`
-console.log('START WEEX VUE RENDER: ${subversion['vue-render']}, Build ${now()}.');
-window._jslib_init_start = window.performance && window.performance.now && window.performance.now() || +new Date();\n\n`,
+console.log('START WEEX VUE RENDER: ${subversion['vue-render']}, Build ${now()}.');\n\n`,
     format: 'umd',
     plugins: [
       postcss(),
@@ -99,6 +98,36 @@ window._jslib_init_start = window.performance && window.performance.now && windo
         'process.env.WEEX_VERSION': subversion['vue-render']
       })
     ]
+  },
+  'weex-vue-render-core': {
+    moduleName: 'WeexVueRenderCore',
+    entry: absolute('packages/weex-vue-render/src/index.core.js'),
+    dest: absolute('packages/weex-vue-render/dist/index.core.js'),
+    banner:`
+console.log('START WEEX VUE RENDER CORE: ${subversion['vue-render']}, Build ${now()}.');\n\n`,
+    format: 'umd',
+    plugins: [
+      postcss(),
+      nodeResolve({
+        jsnext: true,
+        main: true,
+        browser: true
+      }),
+      replace({
+        'process.env.WEEX_VERSION': subversion['vue-render']
+      })
+    ]
+  },
+  'weex-vue-render-plugins': {
+    format: 'umd',
+    plugins: [
+      postcss(),
+      nodeResolve({
+        jsnext: true,
+        main: true,
+        browser: true
+      })
+    ]
   }
 }
 
@@ -107,7 +136,7 @@ function getConfig (name, minify) {
   const config = {
     moduleName: opt.moduleName,
     entry: opt.entry,
-    dest: minify ? opt.dest.replace(/\.js$/, '.min.js') : opt.dest,
+    dest: minify ? opt.dest && opt.dest.replace(/\.js$/, '.min.js') : opt.dest,
     format: opt.format,
     banner: opt.banner,
     plugins: opt.plugins.concat([

dangerfile.js

@@ -281,9 +281,10 @@ function findReviewer(resolve, reject) {
   var fileToDeletedLinesMap = {}
   var fileToNormalLinesMap = {}
   var fileToBlamesMap = {}
+  var repoName = danger.github.pr.base.repo && danger.github.pr.base.repo.name
   github.pullRequests.get({
     owner: danger.github.pr.base.user.login,
-    repo: danger.github.pr.base.repo.name,
+    repo: repoName,
     number: danger.github.pr.number,
     headers: {Accept: 'application/vnd.github.diff'}
   }, function (err, result) {
@@ -296,7 +297,6 @@ function findReviewer(resolve, reject) {
       let repoURL = danger.github.pr.base.repo.html_url
       let fileName = file.replace(/^.*[\\\/]/, '')
       let blameURL = repoURL + '/blame/' + danger.github.pr.base.ref + '/' + file
-      // console.log("Getting blame html: " + blameURL)
       return getContent(blameURL)
     });
 
@@ -315,18 +315,25 @@ function getContent(url) {
   return new Promise((resolve, reject) => {
     // select http or https module, depending on reqested url
     const lib = url.startsWith('https') ? require('https') : require('http');
-    const request = lib.get(url, (response) => {
-      // handle http errors
-      if (response.statusCode < 200 || response.statusCode > 299) {
-         reject(new Error('Failed to load page, status code: ' + response.statusCode));
-       }
-      // temporary data holder
-      const body = [];
-      // on every content chunk, push it to the data array
-      response.on('data', (chunk) => body.push(chunk));
-      // we are done, resolve promise with those joined chunks
-      response.on('end', () => resolve(body.join('')));
-    });
+    const request = lib.get(url, (function (url) {
+      return (response) => {
+        // handle http errors
+        if (response.statusCode < 200 || response.statusCode > 299) {
+          if (response.statusCode === 404) {
+            // ignore this, probably a renamed file.
+            return resolve('')
+          }
+          reject(new Error('Failed to load page, status code: ' + response.statusCode + ', '
+            + ' url: ' + url));
+        }
+        // temporary data holder
+        const body = [];
+        // on every content chunk, push it to the data array
+        response.on('data', (chunk) => body.push(chunk));
+        // we are done, resolve promise with those joined chunks
+        response.on('end', () => resolve(body.join('')));
+      }
+    })(url));
     // handle connection errors of the request
     request.on('error', (err) => reject(err))
     })

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

@@ -25,6 +25,83 @@ If you perfer cdn way, and use script tag to import a script link, just import i
 <script>{{your js bundle}}</script>
 ```
 
+## use render-core and plugins
+
+You can juse use a **render-core** in your page, and define your needs for the plugins (components and API modules) in your entry file, so that your would save a lot of bundle size and bandwidth. On the other hand, The full version contains all the built-in components and API modules, which will waste a lot of bundle size and bandwidth if you haven't use most of them.
+
+To use the render-core and the plugins, just install the plugins in your entry file.
+
+```javascript
+import Vue from 'vue'
+
+// import render-core.
+import weex from 'weex-vue-render/dist/index.core'
+
+// import the plugins (components and modules) you want to use.
+import slider from 'weex-vue-slider'
+import stream from 'weex-vue-stream'
+
+// init weex.
+weex.init(Vue)
+
+// install the plugins.
+weex.install(slider)
+weex.install(stream)
+
+import App from 'App.vue'
+new Vue(App)
+```
+
+#### built-in components in render-core
+
+These components have already integrated into render-core. You don't have to import and install them:
+
+* div
+* text
+* image
+* scrollable components (scroller, list, waterfall)
+
+#### available built-in components for you to install
+
+| npm module name | component name |
+| --- | --- |
+| weex-vue-a | a |
+| weex-vue-input | input |
+| weex-vue-slider | slider / slider-neighbor |
+| weex-vue-switch | switch |
+| weex-vue-textarea | textarea |
+| weex-vue-video | video |
+| weex-vue-web | web |
+
+#### available API modules for you to install
+
+| npm module name | API module name |
+| --- | --- |
+| weex-vue-animation | animation |
+| weex-vue-clipboard | clipboard |
+| weex-vue-dom | dom |
+| weex-vue-event | event |
+| weex-vue-geolocation | geolocation |
+| weex-vue-global-event | globalEvent |
+| weex-vue-modal | modal |
+| weex-vue-nav | navigator |
+| weex-vue-storage | storage |
+| weex-vue-stream | stream |
+| weex-vue-websocket | websocket |
+| weex-vue-webview | webview |
+
+Some of the above plugins may not be mentioned in weex documents. Just ignore them if you have no idear about what they are and how to use them.
+
+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.