微信小程序引入TDesign组件后报错一直提示路径不对(Component is not found in path)的解决方法

最近在做微信小程序的项目,创建好项目后,按官方方式引入TDesign组件,但还是一直提示报错(Component is not found in path "miniprogram_npm/tdesign-miniprogram/button/button" (using by "pages/login/login").(env: macOS,mp,1.06.2412050; lib: 3.7.11))。

后面解决了,项目详情勾选上将JS编译成ES5。问题原因估计是我使用的小程序模板是TS+Sass的官方模板,

用typescript,打包后小程序工具默认打包成CommonJS模式,导致找不到文件。

官方安装步骤:

1、安装

npm i tdesign-miniprogram -S --production

安装完之后,需要在微信开发者工具中对 npm 进行构建:工具 - 构建 npm。 

构建时会出现NPM packages not found字样

2、构建前的配置

在project.config.json文件中添加配置

    "packNpmManually": true,"packNpmRelationList": [{"packageJsonPath": "./package.json","miniprogramNpmDistDir": "./miniprogram/"}],

 

在tsconfig.json文件中添加配置

"module": "ESNext",  // CommonJS修改为 ESNext  
"paths": {"tdesign-miniprogram/*":["./miniprogram/miniprogram_npm/tdesign-miniprogram/*"]}

3、修改 app.json 

将 app.json 中的 "style": "v2" 移除。

 因为 该配置 表示启用新版组件样式,将会导致 TDesign 的组件样式错乱。

此时这样之后,界面能显示,但控制台还是报错,

 

4、重要的一步骤

微信开发者工具,项目详情勾选上将JS编译成ES5,勾选上后就不报错了,这一步很重要

 

参考文献:

1、 TDesign

2、Component is not found in path “..../miniprogram_npm/@vant/weapp/button/index“ (using by “pages/inde-CSDN博客

3、正确使用微信小程序组件库,解决报错Component is not found in path-CSDN博客 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/899515.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

拦截器和过滤器详解

在 Java Web 开发中,拦截器(Interceptor)和过滤器(Filter)是两种常见的请求处理机制,它们用于对请求和响应进行预处理和后处理 1. 过滤器(Filter) 1.1 作用 Filter 主要用于对 请求…

【机械视觉】C#+VisionPro联合编程———【六、visionPro连接工业相机设备】

【机械视觉】C#VisionPro联合编程———【六、visionPro连接工业相机设备】 目录 【机械视觉】C#VisionPro联合编程———【六、visionPro连接工业相机设备】 前言: 连接步骤说明 一. 硬件连接 支持的相机接口类型: 连接步骤 2. 软件配置 Visio…

笔记:基于环境语义的通感融合技术,将传统通信由“被动接收”转为“主动感知”

《基于计算机视觉的感知通信融合理论与关键技术研发进展》 介绍了联合研发的基于环境语义的通感融合技术研发进展。 观点:利用环境感知信息或环境语义辅助通信的通感融合技术成为6G重要方向之一 产出:基于环境感知的毫米波波束管理方案,并…

Kafka 多线程开发消费者实例

目前,计算机的硬件条件已经大大改善,即使是在普通的笔记本电脑上,多核都已经是标配了,更不用说专业的服务器了。如果跑在强劲服务器机器上的应用程序依然是单线程架构,那实在是有点暴殄天物了。不过,Kafka …

zynq7000 + ucos3 + lwip202_v1_2调试过程

1 现在裸机应用上验证lwip 跑起来可能会报错,看下面的链接解决 zynq 网卡Phy setup error问题 zynq 网卡Phy setup error问题-CSDN博客 2 ping同以后,在zynq上添加ucos系统 链接如下: ZYNQ移植uCOSIII_zynq ucos-CSDN博客 3 移植lwip协议…

Android7 Input(二)Linux 驱动层输入事件管理

概述 在Linux系统中,将键盘,鼠标,触摸屏等这类交互设备交由Linux Input子系统进行管理,Linux Input驱动子系统由于具有良好的和用户空间交互的接口。因此Linux Input驱动子系统,不止于只管理输入类型的设备。也可以将其…

Java内存中的Heap(堆)的作用

Java内存中的Heap(堆)的作用 在 Java 的内存模型中,Heap(堆) 是 JVM(Java Virtual Machine)管理的运行时数据区域之一,主要用于存储程序运行过程中动态分配的对象和数据。它是 Java…

自行车模型与汽车模型的混合策略在自动驾驶中的多维度协同优化

基于动态架构与智能调度的自动驾驶系统设计 #mermaid-svg-1yvF1EzG07ktndY6 {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-1yvF1EzG07ktndY6 .error-icon{fill:#552222;}#mermaid-svg-1yvF1EzG07ktndY6 .error-tex…

mysql.8.4.4--初始化报错--libnuma.so.1缺失

错误 mysqld: error while loading shared libraries: libnuma.so.1: cannot open shared object file: No such file or directory解决办法:下载相关依赖 sudo apt update sudo apt install numactl然后重新初始化 mysqld --initialize

【区块链安全 | 第三篇】主流公链以太坊运行机制

文章目录 1. 以太坊账户类型2. 以太坊网络架构2.1 节点类型2.2 交易流程 3. 共识机制4. Gas 机制4.1 Gas 计算方式4.2 以太坊 EIP-1559 交易机制 5. EVM(以太坊虚拟机)5.1 EVM 结构5.2 EVM 指令5.3 EVM 运行机制 6. 智能合约7. ERC 代币标准7.1 ERC-207.…

计算机三级信息安全部分英文缩写

eip,指令寄存器,用于存放指向下一条将执行指令的指针,即返回地址栈顶指针esp基址指针寄存器EBP,基地址数据执行保护DEP(Data Execute Prevention)技术可以设置内存堆栈区的代码为不可执行状态,从而防范溢出后代码的执行…

【Goalng】第九弹-----文件操作、JSON处理

🎁个人主页:星云爱编程 🔍所属专栏:【Go】 🎉欢迎大家点赞👍评论📝收藏⭐文章 长风破浪会有时,直挂云帆济沧海 目录 1.文件操作 1.1文件介绍 1.2.文件流 1.3.打开和关闭文件 1…

C#高级:启动、中止一个指定路径的exe程序

一、启动一个exe class Program {static void Main(string[] args){string exePath "D:\测试\Test.exe";// 修改为你要运行的exe路径StartProcess(exePath);}private static bool StartProcess(string exePath){// 创建一个 ProcessStartInfo 对象来配置进程启动参…

猜猜我用的是哪个大模型?我的世界游戏界面简单的模拟效果

我的罗里吧嗦的,根据小朋友的要求,边听边写边输入的提示词: 请生成一段完整的在网页中用html5和javascript代码模拟“我的世界”中游戏场景的互动画面,要求提供若干人物选项可以选择,请自行选择需要使用哪些库或框架来…

AI知识补全(八):多模态大模型是什么?

名人说:人生如逆旅,我亦是行人。 ——苏轼《临江仙送钱穆父》 创作者:Code_流苏(CSDN)(一个喜欢古诗词和编程的Coder😊) 上一篇:AI知识补全(七):AI Agent 智能…

更新docker 容器时,提前换后端jar 包,为什么会存在异常

我们现场更新时,通常都是提前将后端jar 包替换了,然后到了更新的时间,只需要更新相关的前端文件和修改各种配置,就行了。 但是最近一次更新操作中,忽然发现,提前更新后端包,会存在依赖丢失问题…

LoRA 模型微调框架核心原理及实现步骤

LoRA(Low-Rank Adaptation)模型微调框架通过低秩矩阵分解原理,实现了对大型预训练模型的高效微调。其核心原理是:在冻结预训练模型权重的基础上,向特定层注入可训练的低秩矩阵,以极少量参数(通常…

XHR.readyState详解

XHR.readyState详解 引言 XHR.readyState是XMLHttpRequest对象的一个属性,它反映了当前请求的状态。在Ajax编程中,正确理解和使用XHR.readyState对于调试和确保异步请求的正确执行至关重要。本文将详细介绍XHR.readyState的属性值、含义以及在Ajax请求中的具体应用。 XHR.…

MySQL8.4 InnoDB Cluster高可用集群使用指南

简介 高可用方案 Orchestrator: 可视化 Web 界面管理 MySQL 拓扑结构,并且兼容多种复制架构(异步、半同步、GTID),提供自动和手动的故障转移。但是8.0.21后 MySQL 更新了主从复制相关命令,Orchestrator无…

扩散模型总结

目录 定义与原理 发展历程 正向扩散过程 反向扩散过程 噪声预测网络 离散时间模型 连续时间模型 条件扩散模型 生成质量 训练稳定性 采样灵活性 图像生成 音频合成 文本生成 计算效率 模型复杂度 定义与原理 扩散模型是一种新型的生成模型,其核心原理源于热力…