VUE一勞永逸的元件註冊

2021-08-28 07:09:56 字數 644 閱讀 1895

我們寫了一堆基礎ui元件,然後每次我們需要使用這些元件的時候,都得先import,然後宣告components,很繁瑣!秉持能偷懶就偷懶的原則,我們要想辦法優化!

招式解析:

我們需要借助一下神器webpack,使用 require.context() 方法來建立自己的(模組)上下文,從而實現自動動態require元件。這個方法需要3個引數:要搜尋的資料夾目錄,是否還應該搜尋它的子目錄,以及乙個匹配檔案的正規表示式。

我們在components資料夾新增乙個叫global.js的檔案,在這個檔案裡借助webpack動態將需要的基礎元件統統打包進來。

import vue from 'vue'

function capitalizefirstletter(string)

const requirecomponent = require.context(

'.', false, /\.vue$/

//找到components資料夾下以.vue命名的檔案)

requirecomponent.keys().foreach(filename => )

最後我們在main.js中import 'components/global.js',然後我們就可以隨時隨地使用這些基礎元件,無需手動引入了。

程式設計行業如何一勞永逸

作者用富爸爸的一句話回答 真正的有錢是指,當你全家人在完全不工作的情況下,你還可以維持以前的生活水平多久。怎麼理解富爸爸這句話呢?比如你有20萬,而你乙個月固定開支是2萬,那麼你的財富就是10個月。也就是財富是用時間來衡量的,而不是金錢。那我今天談談,在程式設計行業,如何一勞永逸。通常做經程式設計的...

程式設計行業如何一勞永逸

作者用富爸爸的一句話回答 真正的有錢是指,當你全家人在完全不工作的情況下,你還可以維持以前的生活水平多久。怎麼理解富爸爸這句話呢?比如你有20萬,而你乙個月固定開支是2萬,那麼你的財富就是10個月。也就是財富是用時間來衡量的,而不是金錢。那我今天談談,在程式設計行業,如何一勞永逸。通常做經程式設計的...

一勞永逸的搞定 flex 布局

一切都始於這樣乙個問題 怎樣通過 css 簡單而優雅的實現水平 垂直同時居中。記得剛開始學習 css 的時候,看到float屬性不由得感覺眼前一亮,順理成章的聯想到 word 文件排版中用到的的左對齊 右對齊和居中對齊,然而很快就失望的發現 css 中並不存在float center的寫法,那麼te...