Vue路由组件的按需加载

正常加载方式

通过importxxxfrom的方式加载组件，无论组件有没有被用到，都会被加载进来，造成性能浪费。

import Recommend from '../views/Recommend.vue'
import Singer from '../views/Singer.vue'
import Rank from '../views/Rank.vue'
import Search from '../views/Search.vue'

按需加载方式

采用按需加载的方式，当需要被用到的时候再加载其组件，具体的原理可能和ES6的Promise有关，待后续我深入再详解一下，目前只需了解这样做性能更好即可。

const Recommend = resolove => {
  import('../views/Recommend.vue').then(module => {
    resolove(module)
  })
}
const Singer = resolove => {
  import('../views/Singer.vue').then(module => {
    resolove(module)
  })
}
const Rank = resolove => {
  import('../views/Rank.vue').then(module => {
    resolove(module)
  })
}
const Search = resolove => {
  import('../views/Search.vue').then(module => {
    resolove(module)
  })
}