vue中有很多基礎的元件可以自動化註冊使用
在src/components下面建立 basecomponents/basevue.vue
// the vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import vue from 'vue'
import router from './router'
import upperfirst from 'lodash/upperfirst'//應用模組
import camelcase from 'lodash/camelcase'//轉為駝峰命名
vue.config.productiontip = false
/* eslint-disable no-new */
// 全域性匯入元件
const requirecomponent = require.context(
// 其元件目錄的相對路徑
'./components/basecomponents',
// 是否查詢其子目錄
false,
// 匹配基礎元件檔名的正規表示式, 這裡可以匹配的檔名為ba******.vue格式
/base[a-z]\w+\.(vue|js)$/ )
requirecomponent.keys().foreach(filename => )
new vue()
二、使用的話 直接要在想使用的頁面:
vue 基礎元件的自動化全域性註冊
參考官網 下的 基礎元件的自動化全域性註冊 在日常開發中,有一些元件是比較常用,但是為了避免在開發過程中不停地引入,或者在main.js中註冊,或者每新增乙個元件就需要手動註冊一次。則直接進行自動化全域性註冊。自動化全域性註冊,官網上都詳細的說明,以下是自己官網的說明基礎上進行了乙個demo開發例項...
基礎元件的自動化全域性註冊
require.context是webpack的api,主要用來實現自動化匯入模組,在前端工程中,如果遇到從乙個資料夾引入很多模組的情況,可以使用這個api,它會遍歷資料夾中的指定檔案,然後自動匯入,使得不需要每次顯式的呼叫import匯入模組 例如在main.js中全域性註冊多個元件 基礎元件的自...
元件的自動化全域性註冊
官方位址 在使用vue構建專案的過程中,我們會設定一些通用的元件,他可能只包含了乙個按鈕或者其他的乙個小功能,但是會被我們在不同的元件頁面頻繁呼叫。此時若是每乙個元件頁面都進行引用,將會有很多重複冗雜的 可以改為全域性註冊。具體如下 將這些通用基礎元件放置在同乙個資料夾下 如 components ...