vue 全局组件自动注册

2022-07-12 14:35:34 阅读：118 来源： 互联网

标签：vue name js componentConfig file 组件全局

main.js

// 全局组件自动注册
import '@/components/autoRegister'

autoRegister.js

/**
 * 全局组件自动注册
 *
 * 全局组件各个组件按文件夹区分，文件夹名称与组件名无关联，但建议与组件名保持一致
 * 文件夹内至少保留一个文件名为 index 的组件入口，例如 Verify.vue
 * 普通组件必须设置 name 并保证其唯一，自动注册会将组件的 name 设为组件名，可参考 SvgIcon 组件写法
 * 如果组件是通过 js 进行调用，则确保组件入口文件为 verifition-api.js，可参考 ExampleNotice 组件
 * 不自动注册 则名字为其他的
 */

import Vue from 'vue'

const componentsContext = require.context('./', true, /index.(vue|js)$/)
componentsContext.keys().forEach(file_name => {
    // 获取文件中的 default 模块
    const componentConfig = componentsContext(file_name).default
    if (/.vue$/.test(file_name)) {
        Vue.component(componentConfig.name, componentConfig)
    } else if (/.js/.test(file_name)) {
        Vue.use(componentConfig)
    }
})

标签：vue,name,js,componentConfig,file,组件,全局
来源： https://www.cnblogs.com/yoona-lin/p/16469976.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

vue 全局组件自动注册