#Uniapp:uni-app加载全局组件的方法easycom

发布时间:2024年01月12日

uni-app加载全局组件的方法easycom

定义

在pages.json中配置

{
	"easycom": {
		"autoscan": true,
		"custom": {
			"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue",
			"^uni-app-(.*)": "@/components/c-$1-$1/c-$1-$1.vue"
		}
	},
	"pages": [ //
	]
	}

属性

属性类型默认值描述
autoscanBooleantrue是否开启自动扫描,开启后将会自动扫描符合components/组件名称/组件名称.vue目录结构的组件
customObject-以正则方式自定义组件匹配规则。如果autoscan不能满足需求,可以使用custom自定义匹配规则

说明

  • easycom方式引入的组件无需在页面内import,也不需要在components内声明,即可在任意页面使用。
  • easycom方式引入组件不是全局引入,而是局部引入。例如在H5端只有加载相应页面才会加载使用的组件。
  • 在组件名完全一致的情况下,easycom引入的优先级低于手动引入(区分连字符形式与驼峰形式)。
  • 考虑到编译速度,直接在pages.json内修改easycom不会触发重新编译,需要改动页面内容触发。
  • easycom只处理vue组件,不处理小程序专用组件(如微信的wxml格式组件)。不处理后缀为.nvue的组件。因为nvue页面引入的组件也是.vue组件。可以参考uni ui,使用vue后缀,同时兼容nvue页面。
  • nvue页面里引用.vue后缀的组件,会按照nvue方式使用原生渲染,其中不支持的css会被忽略掉。这种情况同样支持easycom
  • vueuvue 组件优先级,详见
文章来源:https://blog.csdn.net/weixin_47075554/article/details/135555952
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。