vueCli3配置全局组件

2020-04-08  本文已影响0人  觉上云来

main.js内容如下

1.安装camelcase》》npm install camelcase 

2.main.js中添加

const files = require.context('./components', false, /\.vue$/);  //匹配该目录下的所有vue文件

import camelcase from 'camelcase';  //驼峰命名的一个npm包

const moduleStores = {};

files.keys().forEach(key =>{

const fileName = key.slice(2, -3);  //截取vue的文件名

  const fileNameInCamelCase =camelcase(fileName);  //将截取的文件名为驼峰命名

  const fileModule = files(key).default;  //引入模块

  moduleStores[fileNameInCamelCase] = {

...fileModule,    //此处可用...表示模块,ES6语法支持...

    namespaced:true,

  }

});

var components_name = [];  //将获取命名存在里面

for(let kin  moduleStores){

components_name.push(k)

}

for(let j=0;j

//将模块都注册为全局组件,方便在所有组件中易使用

  Vue.component(components_name[j],moduleStores[components_name[j]]);

}

上一篇 下一篇

猜你喜欢

热点阅读