首页 > 其他分享 >通过路径循环匹配vue组件

通过路径循环匹配vue组件

时间:2023-02-02 15:35:46浏览次数:44  
标签:vue 匹配 requireComponent fileName reqCom resultComps 组件

const resultComps = {};
let requireComponent = require.context(
'./', // 在当前目录下查找
true, //false 不遍历子文件夹 true 遍历子文件夹
/\.vue$/ // 正则匹配 以 .vue结尾的文件
)
requireComponent.keys().forEach(fileName => {
// 组件实例
const reqCom = requireComponent(fileName)
resultComps[fileName.replace(/^\.\/(.*)\.\w+$/, '$1')] = reqCom.default
})
export default resultComps

 

标签:vue,匹配,requireComponent,fileName,reqCom,resultComps,组件
From: https://www.cnblogs.com/mrt-yyy/p/17086153.html

相关文章

  • 《Vue.js 设计与实现》读书笔记 - 第7章、渲染器的设计
    第7章、渲染器的设计7.1渲染器与响应系统的结合渲染器需要有跨平台的能力。在浏览器端会渲染为真实的DOM元素。const{effect,ref}=VueReactivity//VueRea......
  • vue添加css样式的方式
    vue添加css样式的方式1、在.vue文件中引入css<stylescopedlang="scss"type="text/scss">@import"../css/style.css";</style> 2、直接在<style>中写......
  • vue.js客服系统实时聊天项目开发(十七)解决url get传参后进行base64解密问题
    有些参数需要在url的GET里传递,但是为了防止特殊字符问题,我转成了base64编码。但是js进行解码的时候,总是报错:报错:Failedtoexecute'atob'on'Window':Thestringto......
  • 解决vite+vue3混合开发白屏问题
    开发环境:vite4.0+vue3.2使用场景:vite打包后将包嵌入app使用。问题描述:打包后app显示白屏。解决方案:默认的构建目标是能支持原生ESM语法的script标签、原生ESM动态导......
  • vue 获取 DOM 元素的方法
    1.原生js获取DOM节点document.querySelector(选择器)document.getElementById(id选择器)document.getElementsByClassName(class选择器)....2.vue2中获取当前组......
  • halcon 基于形状的模板匹配
    【适用场景】适用于尺度变化较小的场景。虽然可以设置缩放尺度,但是耗时增加太大。【对模板的要求】清晰、水平、区别度明显、范围尽量小(模板区域越大越耗时)【相关函数......
  • 快速上手vue前端存储库、全局状态管理工具pinia
    pinia是什么,为什么我们要使用pinia?pinia是vue全局状态管理工具,类似vueX,用于全局的数据状态存储、修改变更等等相较于vueX,pinia的使用较为简单,轻量级,上手容易,干掉了vue......
  • 总结了 Vue3 的七种组件通信方式,别再说不会组件通信了
    总结了Vue3的七种组件通信方式,别再说不会组件通信了播报文章网格化软件高品伟业2022-04-1916:35山东关注 写在前面  本篇文章是全部采用的......
  • vue-plugin-hiprint
    vue-plugin-hiprint(基于hiprint2.5.4)当时只是为了方便我(并非hiprint原作者)在vue项目中引入使用,所以以此命名。此插件仅仅是一个JavaScript【工具库】而非Vue【组件库......
  • ts找不到 ./APP.vue
    在使用vue3+ts中遇到如下问题解决方法:查看跟App.vue同级目录有没有env.d.ts文件,如果有则给里面添加以下代码declaremodule"*.vue"{importtype{DefineComp......