require.context妙用-实现前端自动引入同一文件夹下多个文件(替代import)

// 自动化检测文件,获取然后全局注册
const routerContext = require.context("./", true, /\.vue$/);
const globalComponents = [];
routerContext.keys().forEach(route => {
  const routerModule = routerContext(route);
  // 如果是 gRegion.vue 不处理
  if (route.startsWith("./gRegion")) {
    return;
  }
  /**
   * 兼容 import export 和 require module.export 两种规范
   * import export 有 default 用 routerModule.default
   */
  globalComponents.push(routerModule.default || routerModule);
});

export default {
  install(Vue) {
    // 全局注册组件
    globalComponents.forEach(item => {
      Vue.component(item.name, item);
    });
  }
};
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容