require.context()在VUE中的用法

最新推荐文章于 2024-07-24 08:05:26 发布

一只小山羊

最新推荐文章于 2024-07-24 08:05:26 发布

阅读量1.1k

点赞数

分类专栏： VUE开发技巧文章标签： javascript vue.js 正则表达式

本文链接：https://blog.csdn.net/qq_38998636/article/details/120785053

版权

VUE开发技巧专栏收录该内容

2 篇文章 0 订阅

订阅专栏

require.context()用法

require.context(directory,useSubdirectories,regExp)

directory:表示检索的目录
useSubdirectories：表示是否检索子文件夹
regExp:匹配文件的正则表达式,一般是文件名
例如 require.context("@/views/components",false,/.vue$/)

路由中的应用

let routes = []
let require_module = require.context('.moduled',false,/.js$/)
require_module.keys().forEach((file_name) => {
	routes.push(require_module[file_name].default)
})

组件中的应用

// 自定义组件
const requireComponents = require.context('../views/components', true, /\.vue/)
requireComponents.keys().forEach(fileName => {
  const reqCom = requireComponents(fileName)
  const reqComName =reqCom.name|| fileName.replace(/\.\/(.*)\.vue/,'$1')
  // 组件挂载
  Vue.component(reqComName, reqCom.default || reqCom)
})