乙個webpack的api,通過執行require.context函式獲取乙個特定的上下文,主要用來實現自動化匯入模組,在前端工程中,如果遇到從乙個資料夾引入很多模組的情況,可以使用這個api,它會遍歷資料夾中的指定檔案,然後自動匯入,使得不需要每次顯式的呼叫import匯入模組
require.context函式接受三個引數
語法: require.context(directory, usesubdirectories = false, regexp = /^.//);
//新建index.js檔案// import vue from "vue";
function changestr(str)
//找到上一級common目錄下的.vue結尾的所有檔案
const requirecomponent = require.context("@/components", false, /\.vue$/);
console.log(requirecomponent,"hahaa");
//["./child1.vue", "./child2.vue"]
const install = (vue) => );
};export default ;
最後,在main.js引入該檔案vue.use(index)
Vue全域性元件註冊
最近編寫專案中,會應用到很多基礎元件,起初採用了區域性註冊進行使用,但區域性註冊對於開發人員並不友好,每個階段都要經歷import檔案匯入,component檔案註冊兩個階段,開發效率不高,於是採用了全域性註冊方式,引用基礎元件,但全域性元件會在初次渲染的時候一次性匯入,造成系統比較卡頓。於是,想到...
vue獲取全域性元件 Vue 全域性元件自動註冊
在 vue 中,我們通過 vue.component mycomponentname 的方式來進行全域性元件註冊,但如果需要全域性註冊的元件很多,這時 就會變得比較臃腫,例如 12 註冊 5 個全域性元件 import examplecomponent1 from components exampl...
vue之全域性元件註冊
註冊全域性vue元件,避免多次匯入 註冊 1.建立乙個index.js檔案 匯入元件 import bigimg from bigimg let vue bigimg.install function vue,options 匯出元件 export default bigimg 2.全域性使用,繫結...