vue小技巧———一键全局注册组件

我们在做vue项目时，有些频繁使用的组件，你还需要每次使用的时候都 import 么？那么往这看过来
第一步
把需要频繁使用的组件放在一起，同级新建 global.js

import Vue from 'vue'

function changeStr(str) {
  return str.charAt(0).toUpperCase() + str.slice(1)   //国际惯例，组件首字母大写
}

const requireComponent = require.context('.', false, /\.vue$/)   //  '.' 表示同级目录
requireComponent.keys().forEach((fileName) => {
  const config = requireComponent(fileName)
  const componentName = changeStr(fileName.replace(/^\.\//, '').replace(/\.\w+$/, ''))
  Vue.component(componentName, config.default || config)
})

第二步
在main.js中引入 global.js 即可