这是我参与「第四届青训营 」笔记创作活动的第5天 为了解决组件库注册的问题，我新学会了一种写法 require.context，

require.context的作用

该函数有四个属性

directory:要搜索的文件夹目录;

useSubdirectories：是否还应该搜索它的子目录

regExp：一个匹配文件的正则表达式

mode：是否异步加载

require.context( directory, (useSubdirectories = true), (regExp = /^\.\/.*$/), (mode = 'sync'));

根据上面的属性，我们能够得出，require.context能够得到文件目录下的文件，所以，我们可以通过它来获取到/component目录下的所有组件，然后，因为我们所有的组件的都会有一个name属性，通过default向外暴露，所以，我们可以将require.context得到的全部组件存入一个数组中（假设在这里这个数组叫arr），那么我们可以通过forEach方法对其进行遍历，注意要分隔字符串，然后再通过Vue.Component方法进行全局的注册 代码实例如下

registerAttrs() {
  const arr = getComponents(require.context('@/components', true, /.vue/))
  Object.keys(arr).forEach(compName => {
    Vue.component(compName, arr[compName])
  })
}

export function getComponents(files) {
  const components = {}
  files.keys().forEach(key => {
    const component = files(key)
    let ctrl = component.default || component
    let compName = ctrl.name
    components[compName] = ctrl
  })
  return components
}