In dynamic routing, there is a step to change the string mode of the component returned by the backend to the component mode required by our front-end routing, and an error Cannot find module is reported.

In dynamic routing, there is a step to change the string pattern of the component returned by the backend to the component pattern required by our front-end routing

One, import writing error report

Dynamic routing Cannot find module '@/views/Home.vue'

function loadPageByRoutes(str) {
    
     // 传入的str为 '@/views/Home.vue'  这种格式 
   return () => import(`${
      
      str}`);// 要报错 
}

2. Change to require wording and return a resolve, which is feasible

function loadPageByRoutes(str) {
    
     // views文件夹下的Home组件，传入的格式为 'Home'
  return function (resolve) {
    
    
    require([`@/views/${
      
      str}.vue`], resolve);
  };
}