Vue2 自动注册全局组件（文件夹）

前言：在项目中需要用到很多组件，组件很多的情况下，局部组件引入嫌麻烦，main.js里一个个定义全局组件也不愿意。

所以我们可以定义一个全局组件的文件夹，在里面创建的vue文件会自动注册为全局组件

1，创建需要被注册的文件夹（GlobalComponentFolder）

 2，在（GlobalComponentFolder）文件夹内创建一个JS文件

 3，JS文件内输入内容：

代码： 

import Vue from "vue";
// 默认该文件夹文件自动注册全局组件
// require.context 是webpack的一个api
const req = require.context("./", true, /\.vue$/);
// 全局注册
req.keys().forEach((element, index) => {
  const name = element.replace(/(\.\/)|(\.vue)/gi, "");
  Vue.component(
    `${name.split("/")[name.split("/").length - 1]}`,
    req(element).default
  );
});

4:，main.js内注册创建的文件夹

总结：以上步骤结束后，接下来在（GlobalComponentFolder）文件夹内创建的vue组件，自动注册为全局组件，在页面中输入标签直接使用