/** * 模块加载器, 返回数据格式为对象格式, 对象中的key和value分为以下3种: * 1. 以export default中的name属性为key, 以export default的内容为value的对象; * 2. 以文件名为key, 以export default的内容为value的对象; * 3. 自定义key和value的对象; */ // 验证文件名的扩展名是否为js的文件 const REPLACE_REG = /^([^/]*\/)*|\.js$/g /** * 根据组件中的name和内容作为key和value * @param components 组件对象载体 * @param component 需加载的组件 */ const setByComponentName = (components, component) => { components[component.name] = component } /** * 根据组件中所在文件的文件名和组件的内容作为key和value * @param components 组件对象载体 * @param component 需加载的组件 * @param fileName 组件所在文件的文件名 */ const setByFileName = (components, component, fileName) => { components[fileName.replace(REPLACE_REG, '')] = component } /** * 根据文件模块过滤器加载需要export default中的内容 * @param requireComponent 文件模块过滤器, webpack自带 * @param callback 加载模块的方式,为分3种: 1. 以export default中的name属性为key, 以export default的内容为value的对象; 2. 以文件名为key, 以export default的内容为value的对象; 3. 自定义key和value的对象 * @returns 根据callback中定义的数据格式返回对象 */ const build = (requireComponent, callback) => requireComponent.keys().reduce((components, fileName) => { let componentConfig = requireComponent(fileName) let component = componentConfig.default || componentConfig callback(components, component, fileName) return components }, {}) /** * 对外的接口 */ export default { getByComponentName: requireComponent => build(requireComponent, setByComponentName), getByFileName: requireComponent => build(requireComponent, setByFileName), getByCustom: (requireComponent, callback) => build(requireComponent, callback) }