在uni市场导入项目的组件无法使用,在uni市场导入项目的组件路径正确但找不到组件

6 篇文章 0 订阅
3 篇文章 0 订阅

起因

首先我在咱们的插件市场,下载了一个zero-timeline,并在页面中使用,查看了一下确实符合easycom规范,
在这里插入图片描述
hbuilder也能够在代码视图中查找到他在哪
在这里插入图片描述
但是项目运行起来确报错

pages-buyer-feedback.js:289 Cannot find module '@/uni_modules/zero-timeline/components/zero-timeline/zero-timeline.vue'  
pages-buyer-feedback.js:290 1. 排查组件名称拼写是否正确  
pages-buyer-feedback.js:291 2. 排查组件是否符合 easycom 规范,文档:https://uniapp.dcloud.net.cn/collocation/pages?id=easycom  
pages-buyer-feedback.js:294 3. 若组件不符合 easycom 规范,需手动引入,并在 components 中注册该组件

h-builderx为3.99版本

因为报错,我就把h-builder卸载重装,把之前项目下面hbuilder的配置文件都删了,重新搞项目,但是还是报错

说明

这个问题困扰了我半天,查了大量的资料,都没有和easycom自动引入相关的解决方案能解决我的问题

最终的解决方案

弃用easycom自动引入,改为手工导入(也就是通过components单独安装组件)

具体步骤

1. 在uni插件市场,直接下载

在这里插入图片描述

2. 下载完毕以后,将该插件components中的zero-timeline目录直接复制到你项目的components中

在这里插入图片描述
双击打开components文件夹,就看到了zero-timeline目录
在这里插入图片描述

将zero-timeline目录复制到你的项目中的components目录中
在这里插入图片描述

3. 导入插件

假设 page-a.vue 页面需要用到 badge,则在 page-a.vue 的 script 节点下导入 badge 组件,如下:

	import zeroTimeline from "@/components/zero-timeline/zero-timeline.vue";

注意这里的写法,zeroTimeline 为驼峰命名

4.定义插件

export default {  
    data() {  
        return { /* ... */ }  
    },  
    components: {  
        zeroTimeline 
    }  
}

提示:若从插件市场下载使用多个组件,则每个组件均需在 components 选项中定义,并以逗号分隔。

5.使用插件

	<view class="myMain" v-if="item==0">
		<zero-timeline :dataList='dataList' gap='30px'></zero-timeline>
	</view>

再次运行项目,官方示例正常运行,完美解决了
在这里插入图片描述

  • 3
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值