自动导入

src/autoComponents.js

@@ -1,16 +1,24 @@
 import Vue from 'vue'
 
-import MButton from './components/AutoComponents/MButton'
-import MCard from './components/AutoComponents/MCard'
-import MDialog from './components/AutoComponents/MDialog'
-import MForm from './components/AutoComponents/MForm'
-import MSearch from './components/AutoComponents/MSearch'
-import MTable from './components/AutoComponents/MTable'
+const requireComponent = require.context(
+  './components/AutoComponents', // 组件目录
+  true, // 是否递归子目录
+  /\/[^/]+\/index\.vue$/ // 匹配文件夹下的 index.vue 文件
+)
 
-// 全局注册组件
-Vue.component('MButton', MButton)
-Vue.component('MCard', MCard)
-Vue.component('MDialog', MDialog)
-Vue.component('MForm', MForm)
-Vue.component('MSearch', MSearch)
-Vue.component('MTable', MTable)
+requireComponent.keys().forEach(filePath => {
+  // 获取组件配置
+  const componentConfig = requireComponent(filePath)
+
+  // 获取文件夹名称作为组件名
+  const folderName = filePath
+    .split('/') // 将路径按 '/' 分割
+    .filter(part => part !== '.') // 过滤掉 '.' 部分
+    .shift() // 取第一个部分（即文件夹名）
+
+  // 全局注册组件
+  Vue.component(
+    folderName, // 组件名称
+    componentConfig.default || componentConfig // 组件内容
+  )
+})