component 使用场景： 多个组件之间进行切换
<component v-bind:is="currentComponent" ></component>
require.context() 使用场景：手动引入多个组件
/**
* 动态生成组件模板
* @ components 目录下命名规则 根据对应模块分类，根据模块module_name 创建
* modul_对应模块 (10 问题模块 20 检查项饼图 30 任务饼图 40 地图)
*/
const path = require('path')
const files = require.context('../components/', true,/page.vue$/)
const filesHead = require.context('../part/', true,/header-tab.vue$/)
const modules = {}
files.keys().forEach(key => {
let pathArry = _.split(key,'/')
let name = pathArry[2]+_.split(pathArry[1],'_')[1]
modules[name] = files(key).default || files(key)
})
filesHead.keys().forEach(key => {
let name = _.camelCase(path.basename(key, '.vue'))
modules[name] = filesHead(key).default || filesHead(key)
})
export var components = modules
<script>
import {components} from "../common/components"
export default{
components:components,
}
</script>
