记录vite项目中Cornerstone的兼容问题(持续更新)

🔎 在vite项目中打包提示错误

ESM integration proposal for Wasm" is not supported currently.

⛳️ 问题描述

Error: Could not load /home/xxx/xxx/node_modules/@icr/polyseg-wasm/dist/ICRPolySeg.wasm (imported by node_modules/@icr/polyseg-wasm/dist/index.js): “ESM integration proposal for Wasm” is not supported currently. Use vite-plugin-wasm or other community plugins to handle this. Alternatively, you can use .wasm?init or .wasm?url. See https://vitejs.dev/guide/features.html#webassembly for more details.

🎯 临时解决方案

import { defineConfig } from "vite";export default defineConfig({resolve: {alias: {"@cornerstonejs/tools": "@cornerstonejs/tools/dist/umd/index.js"},},
});

📡 官方进度

关注:https://github.com/cornerstonejs/cornerstone3D/issues/1071


🔎 在vite项目中由于循环引用导致影像无法显示的问题

failed Error: loadImageFromImageLoader: no image loader for imageId

⛳️ 问题描述

在vite项目中安装1.4X.X+版本的Cornerstone时,一直会有以下报错信息:
在这里插入图片描述

📡 问题定位

在代码调试时,可以看到以下调试信息,在ImageLoader文件中,imageLoaders变量是一个模块内的全局变量,通过调用注册函数初始化

  • imageLoaders 变量声明(Cornerstone源码中实现)
// node_modules/@cornerstonejs/core/src/loaders/imageLoader.ts
export function registerImageLoader(scheme: string,imageLoader: ImageLoaderFn
): void {// imageLoaders 为全局变量,通过调用 registerImageLoader 这个函数初始化imageLoaders[scheme] = imageLoader;
}
  • imageLoaders 初始化(项目代码中实现,即调用上面声明的这个函数)
cornerstone.imageLoader.registerImageLoader('wadouri', cornerstoneDICOMImageLoader.wadouri.loadImage);

在执行完该步骤后,imageLoaders中应该含有’wadouri’属性的对象,但是在debugger中查看 imageLoaders 依旧为undefined
在这里插入图片描述

查看调试中的imageLoaders变量,发现文件指向 node_modules/@cornerstonejs/streaming-image-volume-loader/node_modules/@cornerstonejs/core/src/loaders/imageLoader.ts, 即 我们执行的上述【imageLoaders 初始化】过程是初始化了项目node_modules中的imageLoaders变量,但是在渲染dicom文件时,调用的是@cornerstonejs/streaming-image-volume-loader 库中自己node_modules下的imageLoaders变量。

✨✨✨ 结论:Vite 基于 ES 模块,每个模块都是在其自己的作用域中执行的所以在不同的目录中初始化的变量只能在自己的作用域中生效。

🎯 解决方案

  1. 确保两个库使用的是同一个 @cornerstonejs/core 实例:即@cornerstonejs/core 在整个项目中只被加载一次,可以通过设置 package.jsonresolutions 字段来强制使用同一版本。
{"resolutions": {"@cornerstonejs/core": "^版本号"}
}
  1. 配置 Vite 以确保正确的依赖解析
// vite.config.js
import { defineConfig } from 'vite';export default defineConfig({resolve: {alias: {'@cornerstonejs/core': require.resolve('@cornerstonejs/core'),},},
});

通过以上配置解决循环依赖中,模块变量无法访问的问题

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

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

相关文章

js ES6 part3

Number 是内置构造函数&#xff0c;用来创建数值 const price 12.345console.log(price.toFixed(2))//保留两位小数 12.35 综合案例购物车 <body><div class"list"><!-- <div class"item"><img src"https://yanxuan-item…

【代码随想录】【算法训练营】【第66天】 [卡码95]城市间货物运输II [卡码96]城市间货物运输III

前言 思路及算法思维&#xff0c;指路 代码随想录。 题目来自 卡码网。 day 66&#xff0c;周五&#xff0c;ding ding~ [卡码95] 城市间货物运输II 题目描述 卡码95 城市间货物运输II 解题思路 前提&#xff1a; 思路&#xff1a; 重点&#xff1a; 代码实现 C语言 …

数据结构(Java):队列Queue集合力扣面试OJ题

1、队列 1.1 队列的概念 队列是一个特殊的线性表&#xff0c;只允许在一端&#xff08;队尾&#xff09;进行插入数据操作&#xff0c;在另一端&#xff08;对头&#xff09;进行删除数据。队列具有先进先出FIFO(First In First Out)的特性。 入队&#xff1a;数据只能从队尾…

有奖竞猜!斗牛士军团与法兰西骑士的终极之战,谁将笑傲欧洲之巅?

痛快看球&#xff0c;畅玩游戏&#xff0c;AGON爱攻带你进入酣畅淋漓的足球世界&#xff01; 7月15日&#xff0c;绿茵赛场硝烟再起&#xff0c;两支身披荣光的王者之师&#xff0c;一路过关斩将&#xff0c;最终会师决赛。一场万众瞩目的巅峰对决即将拉开帷幕&#xff0c;究竟…

linux UDP通讯:接口函数示例

一、主要用的接口&#xff1a; //服务器端 1. socket() 创建套接字 2. bind() 绑定套接字 与TCP区别开来&#xff0c;没有listen()、accept()建立连接的过程 3. 通信 recvfrom() sendto() 4. close //客户端 1. socket() 创建套接字 与TCP区别开来&#xff0c;没有connect()建立…

数据结构——排序算法(冒泡、快速、选择、插入)

文章目录 1. 概念 2. 十大排序算法 3. 冒泡排序 4. 冒泡代码实现 5. 快速排序 6. 快速代码实现 7. 选择排序 8. 选择代码实现 9. 插入排序 10. 插入代码实现 1. 概念 排序&#xff08;Sort&#xff09;是将无序的记录序列&#xff08;或称文件&#xff09;调整成有序…

LabVIEW前面板占满整个屏幕(转)

希望在运行一个LabVIEW程序时&#xff0c;它的前面板能够占据整个屏幕&#xff0c;且不显示Windows的任务栏或其他任何的LabVIEW菜单选项。怎样才能实现这一功能&#xff1f; 您可以通过手动配置或编程的方式实现该功能。 手动配置VI属性 您可以通过以下操作&#xff0c;将…

导入项目,JAVA文件是咖啡杯图标

问题 从图中可以看到&#xff0c;JAVA文件是咖啡杯图标 原因 项目没有识别为MAVEN项目 解决办法 进入pom.xml文件&#xff0c;右键点击Add as Maven Project即可

在Ubuntu 16.04上安装和保护MongoDB的方法

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站。 简介 MongoDB 是一个免费且开源的面向文档的数据库。它被归类为 NoSQL 数据库&#xff0c;因为它不依赖于传统的基于表的关系型数据库结…

Spring MVC入门3

看完这篇博客你能学到什么 理解JSON的使用理解注解PathVariable理解解注解RequestPart理解cookie和Session的基本概念理解cookie和Session的区别 如果想真正掌握&#xff0c;还需要自己勤加练习。 正文 JSON JSON概念 JSON&#xff1a;JavaScript Object Notation 【JavaS…

【YOLOv8】 用YOLOv8实现数字式工业仪表智能读数(一)

上一篇圆形表盘指针式仪表的项目受到很多人的关注&#xff0c;咱们一鼓作气&#xff0c;把数字式工业仪表的智能读数也研究一下。本篇主要讲如何用YOLOV8实现数字式工业仪表的自动读数&#xff0c;并将读数结果进行输出&#xff0c;若需要完整数据集和源代码可以私信。 目录 &…

gin源码分析

一、高性能 使用sync.pool解决频繁创建的context对象&#xff0c;在百万并发的场景下能大大提供访问性能和减少GC // ServeHTTP conforms to the http.Handler interface. // 每次的http请求都会从sync.pool中获取context&#xff0c;用完之后归还到pool中 func (engine *Engin…

在C++中怎样使用C库

在C中使用C库是一个相对直接的过程&#xff0c;因为C是从C发展而来的&#xff0c;并且与C高度兼容。这意味着你可以直接在C代码中使用C库函数、头文件和变量&#xff0c;而无需进行特殊转换。以下是一些基本的步骤和注意事项&#xff0c;用于在C中使用C库&#xff1a; 1. 包含…

c语言位操作符相关题目之交换两个数的值

文章目录 一、题目二、方法11&#xff0c;思路2&#xff0c;代码实现 三、方法21&#xff0c;思路2&#xff0c;代码实现 四、方法31&#xff0c;思路2&#xff0c;代码实现 总结 提示&#xff1a;以下是本篇文章正文内容&#xff0c;下面案例可供参考 一、题目 实现两个变量的…

浅谈PostCSS

1. 背景 css的预处理器语言&#xff08;比如 sass&#xff0c; less&#xff0c; stylus&#xff09;的扩展性不好&#xff0c;你可以使用它们已有的功能&#xff0c;但如果想做扩展就没那么容易。 sass是很常用的css预处理器语言&#xff0c;在webpack中要使用它&#xff0c;…

设计模式使用场景实现示例及优缺点(结构型模式——组合模式)

结构型模式 组合模式&#xff08;Composite Pattern&#xff09; 组合模式使得用户对单个对象和组合对象的使用具有一致性。 有时候又叫做部分-整体模式&#xff0c;它使我们树型结构的问题中&#xff0c;模糊了简单元素和复杂元素的概念&#xff0c;客户程序可以像处理简单元…

小米起诉“小米”商标侵权,索赔500万!

近日浙江丽水有家叫小米的公司&#xff0c;因为商标侵权被小米科技起诉索赔500万&#xff0c;需要变更企业名称&#xff0c;官网也不能用“小米智能大家居”等&#xff0c;还有其它的赔偿&#xff0c;普推知产商标老杨分析&#xff0c;“小米智能大家居”“小米”&#xff0c;后…

【Flask从入门到精通:第九课:数据库基本操作、数据表操作以及数据操作】

数据库操作 数据库驱动&#xff08;drivers&#xff09;模块&#xff1a;pymysql、MySQLDB 数据库基本操作 在SQLAlchemy中&#xff0c;添加、修改、删除操作&#xff0c;均由数据库会话(sessionSM)管理。 会话用 db.session 表示。在准备把数据写入数据库前&#xff0c;要先…

交易平台Zero Hash现已支持SUI交易

Zero Hash是一家领先的加密货币和稳定币基础设施平台&#xff0c;为包括Stripe、Shift4和Franklin Templeton在内的公司提供支持&#xff0c;现在也支持对SUI的访问。此举使Zero Hash的客户及其终端用户能够使用SUI。 提供API和SDK以及专注于无缝连接法币、加密货币和稳定币的…

读人工智能全传11人工智能会出什么错

1. 人工智能会出什么错 1.1. 一些报道是公正合理的&#xff0c;不过坦白地说&#xff0c;大部分报道都愚蠢得无可救药 1.2. 一些报道颇有知识性和引导性&#xff0c;而大部分则是杞人忧天式的恐吓 1.3. 滑稽的报道迎合了大众对人工智能的“终结者式恐惧” 1.3.1. 我们创造出…