vue 路由-->进行路由懒加载

引入路由文件

import Vuefrom 'vue'

import Routerfrom 'vue-router'

动态引入路由组件

const GamePlatForm = () =>import(/* webpackChunkName: "group-foo" */ '@/pages/game/platForm/platForm')

const GamePlatFormAdd = () =>import(/* webpackChunkName: "group-foo" */ '@/pages/game/platForm/platFormAdd')

const GamePlatFormEdit = () =>import(/* webpackChunkName: "group-foo" */ '@/pages/game/platForm/platFormEdit')

const GamePlatFormMain = () =>import(/* webpackChunkName: "group-foo" */ '@/pages/game/platForm/platformMaintenance')

/* webpackChunkName: "group-foo" */  目的是为了方便进行页面组件划分，加载什么组件。组件进行分类

这里需要配置一个文件，build文件下的，base.config文件

output: {

path:config.build.assetsRoot,

  filename:'[name].js',

  publicPath: process.env.NODE_ENV ==='production'

    ?config.build.assetsPublicPath

    :config.dev.assetsPublicPath,

  chunkFilename:'[name].js'         -------------- 需要配置的文件

},

正常调用即可：

{

path:'/bgmwaitevent',

  name:'BgmWaitEvent',

  component: BgmWaitEvent,

  meta: {keepAlive:true}

},