vue 将components文件夹中高频公共组件,注册成全局组件
1.在components文件夹下新建一个test.vue,global.js代码如下:
import Vue from 'vue' function changeStr (str) { return str.charAt(0).toUpperCase() + str.slice(1) } const requireComponent = require.context('./', false, /\.vue$/) export default function install () { requireComponent.keys().forEach(fileName => { // 组件中信息 let config = requireComponent(fileName) console.log('config:', config) // 定义组件名 let componentName = changeStr( fileName.replace(/^\.\//, '').replace(/\.\w+$/, '') ) console.log('componentName', componentName) Vue.component(fileName, config.default || config) }) }
2.在main.js中引入global.js
import install from './components/global' install()
3.在.vue文件中可以直接引用
<test></test>