vue-router dynamic routing theme.js disposed under the authority "as it exceeds the max of" 500KB ".

Requirements: According to the different roles of people log on, showing different functional modules in the background to maintain front-end routing, dynamic routing registration.

Process:

　　First, the login is successful, access token

　　Secondly, the interface request header carries people currently logged token, the retrieval module

axios('module.list').then(res => {
  if (res.data.status === 200) {
    this.moduleList = res.data.res;
  }  
})

 

　　Next, the data processing format, the format is the main component is, for example: import ( `@ view / user / $ {item.path}`)

　　　　

this.newAddRouter = this.moduleList.map(item => {
    return {
       code: item.code,
　　　　icon: item.iconUrl,
　　　　name: item.routerPath,
　　　　path: item.routerPath,
　　　　title: item.name,
　　　　id: item.id,
　　　　component: () => import(`@/views/tv/tv-nine/${item.path}`), // 正确的写法
　　   // component: () => import(`${item.path}`), // 报错 theme.js" as it exceeds the max of "500KB".
　　
　　　　parentId: item.parentId, 

　　　　children: []
　　
　　}; 

}); 

Omitted herein recursive process

　　

　　Finally, this.addroutes () to register dynamic routing　　

this.$router.addroutes(newAddRouter);