使用情景:vue
有頻繁使用的組件 須要進行全局註冊ui
能夠將這些組件都放在components下同一個文件夾下,在此文件夾中創建 一個js文件 代碼以下:spa
import Vue from 'vue'; // 修改文件名首字母大寫 function changeComponentName (str) { return str.charAt(0).toUpperCase() + str.slice(1); } // 獲取當前文件夾下的的組件 // require.context 三個參數 第一個表示讀取文件的路徑 第二個表示是否遍歷文件的子目錄 第三個表示匹配的文件的正則 const requireComponent = require.context('.', false, /\.vue$/); requireComponent.keys().forEach(fileName => { const config = requireComponent(fileName); const componetName = changeComponentName( // 去掉開頭 ./ 以及後面.vue fileName.replace(/^\.\//, '').replace(/\.\w+$/, '') ); Vue.component(componetName, config.default || config); })
最後一步 : 在main.js中引入 當前的js文件, 便可全局使用code