全局组件批量注册

main.js中

//需要注册的组件名
let vueComponent = [];

// 自定义组件  
const requireComponents = require.context("@/components/", true, /index.vue/);

// 遍历出每个组件的路径
requireComponents.keys().forEach((fileName) => {
  // 组件实例
  const reqCom = requireComponents(fileName);
  // 截取路径作为组件名
  const reqComName =
    reqCom.name || fileName.replace(/./(.*)/index.vue/, "$1");
  // 组件挂载
  if (vueComponent.includes(reqComName) == true) {
    Vue.component(reqComName, reqCom.default || reqCom);
  }
});

require.context(directory,useSubdirectories,regExp)

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

最后

以上就是彩色万宝路为你收集整理的全局组件批量注册的全部内容，希望文章能够帮你解决全局组件批量注册所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。