实现原理 import.meta.glob const modules = import.meta.glob(‘./dir/*.js’)
以上将会被转译为下面的样子：
// vite 生成的代码 const modules = { ‘./dir/foo.js’: () => import(‘./dir/foo.js’), ‘./dir/bar.js’: () => import(‘./dir/bar.js’), }
自动引入组件 假设有如下的项目文件目录：
components – A.vue – B.vue
通过如下代码可实现自动将该目录下的组件注册到全局组件：
/*
- @author 友人a丶
- @date 2022-07-11
- @app Vue应用对象
- 批量导入指定文件夹内的所有组件
- /
export default function (app) {
/
- 指定要导入的文件目录
- 直接加载用globEager,懒加载用glob
- / const modules = import.meta.glob([ ‘./components/.vue’, ],{eager:true}); /*
- 批量引入组件
- / for (let i in modules) { let name=/(.)?/(.*).vue/.exec(i); app.component(name[2],modules[i].default); } }
在main.js内调用上述方法， 就可以在整个项目内直接使用这个目录下的所有组件。
阅读剩余 0%
本站所有文章资讯、展示的图片素材等内容均为注册用户上传(部分报媒/平媒内容转载自网络合作媒体)，仅供学习参考。
用户通过本站上传、发布的任何内容的知识产权归属用户或原始著作权人所有。如有侵犯您的版权，请联系我们反馈本站将在三个工作日内改正。
