学习日记【vue】-2020/12/10

学到一个动态引入同目录下vue组件的js小工具

//动态引入 webpack
//1.目标文件夹
//2.是否匹配子目录
//3.匹配什么类型的文件

import Vue from 'vue'

function changeStr(){
    return str.charAt(0).toUpperCase()+str.slice(1);
}
const requireComponent = require.context('.',false,/\.vue$/);
requireComponent.keys().forEach(fileName => {
    //当前循环项
    console.log(requireComponent.keys());
    const config = requireComponent(fileName);
    console.log(fileName);
    //fileName.chile1.vue
    const componentName = changeStr(
        fileName.replace(/^\.\//,'').replace(/\.\w+$/,'')
        )
    Vue.component(componentName,config.default || config)
});

 

posted @ 2020-12-10 16:54  Shimamura。  Views(47)  Comments(0)    收藏  举报