upgrade to es6 (WIP)

Author: yyx990803

src/directives/link.js

@@ -1,32 +1,31 @@
+import { warn } from '../util'
+
 // install v-link, which provides navigation support for
 // HTML5 history mode
+export default function (Vue) {
 
-module.exports = function (Vue) {
-
-  var _ = Vue.util
-  var routerUtil = require('../util')
+  let _ = Vue.util
 
   Vue.directive('link', {
 
     isLiteral: true,
 
     bind: function () {
-      var vm = this.vm
+      let vm = this.vm
       /* istanbul ignore if */
       if (!vm.$route) {
-        routerUtil.warn(
+        warn(
           'v-link can only be used inside a ' +
           'router-enabled app.'
         )
         return
       }
-      var self = this
-      var router = vm.$route._router
-      this.handler = function (e) {
+      let router = vm.$route._router
+      this.handler = (e) => {
         if (e.button === 0) {
           e.preventDefault()
-          if (self.destination != null) {
-            router.go(self.destination)
+          if (this.destination != null) {
+            router.go(this.destination)
           }
         }
       }
@@ -42,11 +41,11 @@ module.exports = function (Vue) {
     },
 
     updateClasses: function (path) {
-      var el = this.el
-      var dest = this.destination
-      var router = this.vm.$route._router
-      var activeClass = router._linkActiveClass
-      var exactClass = activeClass + '-exact'
+      let el = this.el
+      let dest = this.destination
+      let router = this.vm.$route._router
+      let activeClass = router._linkActiveClass
+      let exactClass = activeClass + '-exact'
       if (path.indexOf(dest) === 0 && path !== '/') {
         _.addClass(el, activeClass)
       } else {
@@ -63,10 +62,10 @@ module.exports = function (Vue) {
       this.destination = path
       this.updateClasses(this.vm.$route.path)
       path = path || ''
-      var router = this.vm.$route._router
-      var isAbsolute = path.charAt(0) === '/'
+      let router = this.vm.$route._router
+      let isAbsolute = path.charAt(0) === '/'
       // do not format non-hash relative paths
-      var href = router.mode === 'hash' || isAbsolute
+      let href = router.mode === 'hash' || isAbsolute
         ? router.history.formatPath(path)
         : path
       if (this.el.tagName === 'A') {

src/history/abstract.js

@@ -1,27 +1,28 @@
-var util = require('../util')
+import { resolvePath } from '../util'
 
-function AbstractHistory (options) {
-  this.onChange = options.onChange
-  this.currentPath = '/'
-}
+export default class AbstractHistory {
 
-AbstractHistory.prototype.start = function () {
-  this.onChange('/')
-}
+  constructor (options) {
+    this.onChange = options.onChange
+    this.currentPath = '/'
+  }
 
-AbstractHistory.prototype.stop = function () {
-  // noop
-}
+  start () {
+    this.onChange('/')
+  }
 
-AbstractHistory.prototype.go = function (path) {
-  path = this.currentPath = this.formatPath(path)
-  this.onChange(path)
-}
+  stop () {
+    // noop
+  }
 
-AbstractHistory.prototype.formatPath = function (path) {
-  return path.charAt(0) === '/'
-    ? path
-    : util.resolvePath(this.currentPath, path)
-}
+  go (path) {
+    path = this.currentPath = this.formatPath(path)
+    this.onChange(path)
+  }
 
-module.exports = AbstractHistory
+  formatPath (path) {
+    return path.charAt(0) === '/'
+      ? path
+      : resolvePath(this.currentPath, path)
+  }
+}

src/index.js

@@ -1,5 +1,5 @@
-var routerUtil = require('./util')
-var Router = require('./router')
+import { warn } from './util'
+import Router from './router'
 
 /**
  * Installation interface.
@@ -9,15 +9,15 @@ var Router = require('./router')
 Router.install = function (Vue) {
   /* istanbul ignore if */
   if (Router.installed) {
-    routerUtil.warn('already installed.')
+    warn('already installed.')
     return
   }
   require('./router/api')(Vue, Router)
   require('./router/internal')(Vue, Router)
   require('./directives/view')(Vue)
   require('./directives/link')(Vue)
   require('./override')(Vue)
-  routerUtil.Vue = Vue
+  Router.Vue = Vue
   Router.installed = true
 }
 
@@ -27,4 +27,4 @@ if (typeof window !== 'undefined' && window.Vue) {
   Router.install(window.Vue)
 }
 
-module.exports = Router
+export default Router

src/override.js

@@ -1,32 +1,32 @@
 // overriding Vue's $addChild method, so that every child
 // instance inherits the route data
 
-module.exports = function (Vue) {
+export default function (Vue) {
 
-  var addChild = Vue.prototype.$addChild
+  let addChild = Vue.prototype.$addChild
 
   Vue.prototype.$addChild = function (opts, Ctor) {
 
-    var route = this.$route
-    var router = route && route._router
+    let route = this.$route
+    let router = route && route._router
 
     // inject meta
     if (router) {
       opts = opts || {}
-      var meta = opts._meta = opts._meta || {}
+      let meta = opts._meta = opts._meta || {}
       meta.$route = route
       if (opts._isRouterView) {
         meta.$loadingRouteData = meta.$loadingRouteData || false
       }
     }
 
-    var child = addChild.call(this, opts, Ctor)
+    let child = addChild.call(this, opts, Ctor)
 
     if (router) {
       // keep track of all children created so we can
       // update the routes
       router._children.push(child)
-      child.$on('hook:beforeDestroy', function () {
+      child.$on('hook:beforeDestroy', () => {
         router._children.$remove(child)
       })
     }

src/pipeline.js

@@ -1,4 +1,4 @@
-var util = require('./util')
+import { getRouteConfig, resolveAsyncComponent } from './util'
 
 /**
  * Determine the reusability of an existing router view.
@@ -8,8 +8,8 @@ var util = require('./util')
  * @param {Transition} transition
  */
 
-exports.canReuse = function (view, handler, transition) {
-  var component = view.childVM
+export function canReuse (view, handler, transition) {
+  let component = view.childVM
   if (!component || !handler) {
     return false
   }
@@ -18,7 +18,7 @@ exports.canReuse = function (view, handler, transition) {
   if (view.Component !== handler.component) {
     return false
   }
-  var canReuseFn = util.getRouteConfig(component, 'canReuse')
+  let canReuseFn = getRouteConfig(component, 'canReuse')
   return typeof canReuseFn === 'boolean'
     ? canReuseFn
     : canReuseFn
@@ -37,9 +37,9 @@ exports.canReuse = function (view, handler, transition) {
  * @param {Function} next
  */
 
-exports.canDeactivate = function (view, transition, next) {
-  var fromComponent = view.childVM
-  var hook = util.getRouteConfig(fromComponent, 'canDeactivate')
+export function canDeactivate (view, transition, next) {
+  let fromComponent = view.childVM
+  let hook = getRouteConfig(fromComponent, 'canDeactivate')
   if (!hook) {
     next()
   } else {
@@ -55,14 +55,14 @@ exports.canDeactivate = function (view, transition, next) {
  * @param {Function} next
  */
 
-exports.canActivate = function (handler, transition, next) {
-  util.resolveAsyncComponent(handler, function (Component) {
+export function canActivate (handler, transition, next) {
+  resolveAsyncComponent(handler, (Component) => {
     // have to check due to async-ness
     if (transition.aborted) {
       return
     }
     // determine if this component can be activated
-    var hook = util.getRouteConfig(Component, 'canActivate')
+    let hook = getRouteConfig(Component, 'canActivate')
     if (!hook) {
       next()
     } else {
@@ -79,9 +79,9 @@ exports.canActivate = function (handler, transition, next) {
  * @param {Function} next
  */
 
-exports.deactivate = function (view, transition, next) {
-  var component = view.childVM
-  var hook = util.getRouteConfig(component, 'deactivate')
+export function deactivate (view, transition, next) {
+  let component = view.childVM
+  let hook = getRouteConfig(component, 'deactivate')
   if (!hook) {
     next()
   } else {
@@ -98,40 +98,40 @@ exports.deactivate = function (view, transition, next) {
  * @param {Function} [cb]
  */
 
-exports.activate = function (view, transition, depth, cb) {
-  var handler = transition.activateQueue[depth]
+export function activate (view, transition, depth, cb) {
+  let handler = transition.activateQueue[depth]
   if (!handler) {
     view.setComponent(null)
     cb && cb()
     return
   }
 
-  var Component = view.Component = handler.component
-  var activateHook = util.getRouteConfig(Component, 'activate')
-  var dataHook = util.getRouteConfig(Component, 'data')
-  var waitForData = util.getRouteConfig(Component, 'waitForData')
+  let Component = view.Component = handler.component
+  let activateHook = getRouteConfig(Component, 'activate')
+  let dataHook = getRouteConfig(Component, 'data')
+  let waitForData = getRouteConfig(Component, 'waitForData')
 
   // unbuild current component. this step also destroys
   // and removes all nested child views.
   view.unbuild(true)
   // build the new component. this will also create the
   // direct child view of the current one. it will register
   // itself as view.childView.
-  var component = view.build({
+  let component = view.build({
     _meta: {
       $loadingRouteData: !!(dataHook && !waitForData)
     }
   })
 
   // cleanup the component in case the transition is aborted
   // before the component is ever inserted.
-  var cleanup = function () {
+  let cleanup = () => {
     component.$destroy()
   }
 
   // actually insert the component and trigger transition
-  var insert = function () {
-    var router = transition.router
+  let insert = () => {
+    let router = transition.router
     if (router._rendered || router._transitionOnLoad) {
       view.transition(component)
     } else {
@@ -143,7 +143,7 @@ exports.activate = function (view, transition, depth, cb) {
   }
 
   // called after activation hook is resolved
-  var afterActivate = function () {
+  let afterActivate = () => {
     // activate the child view
     if (view.childView) {
       exports.activate(view.childView, transition, depth + 1)
@@ -174,9 +174,9 @@ exports.activate = function (view, transition, depth, cb) {
  * @param {Transition} transition
  */
 
-exports.reuse = function (view, transition) {
-  var component = view.childVM
-  var dataHook = util.getRouteConfig(component, 'data')
+export function reuse (view, transition) {
+  let component = view.childVM
+  let dataHook = getRouteConfig(component, 'data')
   if (dataHook) {
     loadData(component, transition, dataHook)
   }
@@ -194,8 +194,8 @@ exports.reuse = function (view, transition) {
 
 function loadData (component, transition, hook, cb, cleanup) {
   component.$loadingRouteData = true
-  transition.callHook(hook, component, function (data) {
-    for (var key in data) {
+  transition.callHook(hook, component, (data) => {
+    for (let key in data) {
       component.$set(key, data[key])
     }
     component.$loadingRouteData = false