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": [ //
]
}
属性 | 类型 | 默认值 | 描述 |
---|---|---|---|
autoscan | Boolean | true | 是否开启自动扫描,开启后将会自动扫描符合components/组件名称/组件名称.vue 目录结构的组件 |
custom | Object | - | 以正则方式自定义组件匹配规则。如果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
。vue
与 uvue
组件优先级,详见