vue动态路由加载时 Cannot find module xxx 错误解决方法

vue由静态路由改为动态路由时,出现下面的错误

静态路由懒加载,当我们把router写死import()里面它是正常加载的,可是我们通过api接口拉取过来的数据时,发现是不报了上面的错。

export const importPath = (comUrl) => {

  return () => import(`@${comUrl}.vue`)

}

分析后台返回的数据

vue动态路由加载时 Cannot find module xxx 错误解决方法_第1张图片

根据后台返回给我数据component 所以在filterComponent 方法里面@ 符合后面不需要加/

const path =  importPath(component)

console.log(path)

path =  @/views/process/report/index.vue

报错就是这么出现的,但我查阅了webpack import 文档以后发现问题所在

import 传入的地址是通过正则去查找的

vue动态路由加载时 Cannot find module xxx 错误解决方法_第2张图片

webpackimport文档 请查阅

修改importPath 方法

删除component字符串左侧斜杠 /

export const importPath = (comUrl) => {

  const path = subObliqueLine(comUrl)

  return () => import(`@/${path}.vue`)

}

export const subObliqueLine = (str) => {

  if (str === undefined) {

    return str

  }

  return str.replace(/(^\/*)/g, '')

}

我的webpack版本号

你可能感兴趣的:(vue动态路由加载时 Cannot find module xxx 错误解决方法)