# Using threejs in two separate Blazor-imported modules throws "WARNING: multiple instance of Three.js being imported"

**URL:** <https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497>\
**Category:** Questions\
**Created:** [August 20, 2024, 8:05am UTC](https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497 "2024-08-20T08:05:33Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![oscarsjo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/oscarsjo/32/50850_2.png) [@oscarsjo](https://discourse.threejs.org/u/oscarsjo)\
**Post date:** [August 20, 2024, 8:05am UTC](https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497/1 "2024-08-20T08:05:33Z")

</div>

Hello,

We’re using three in different parts of a Blazor-application. Three is used in two different modules, which are imported separately in the app (see screenshot).

We’re disposing the module and other dependencies in three, but it seems three is not fully unloaded, because it throws the warning when we switch between these two modules (only on first load though).

Anyone got an idea on how to fully unload three or any other way to solve this?

Is this warning only related to the issue of possible conflicting versions ?

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/4/e/4e21d7f99dc6b73140dce71a6607c63c8cc16b99.png)

---

<div class="post-metadata">

**Author:** ![emkajeej](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/emkajeej/32/51111_2.png) [@emkajeej](https://discourse.threejs.org/u/emkajeej)\
**Post date:** [August 20, 2024, 3:34pm UTC](https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497/2 "2024-08-20T15:34:48Z")

</div>

The warning is to notify you of either conflicting revisions, or possible overhead being loaded.  
Personally I would prefer it if it only throws the warning when it detects different revisions being loaded, but that’s me.

The revision gets added to the window object by the way. So while unloading and purging Three, that revision will linger on. You can manually get rid of it by undefining `window. __THREE__ ` if you really want that warning to be gone. Just make sure you’re really unloading the three instance before loading a new one 🙂

---

<div class="post-metadata">

**Author:** ![manthrax](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/manthrax/32/2596_2.png) [@manthrax](https://discourse.threejs.org/u/manthrax)\
**Post date:** [August 20, 2024, 7:56pm UTC](https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497/3 "2024-08-20T19:56:17Z")

</div>

It’s actually a potentially deeper issue to have multiple instances of threejs even if they are the same revision, just coming from different sources, since there is internal state stored in the THREEJS namespace… like caching for instance.

@oscarsjo are you using  
importmaps  
in your html to declare where to load threejs from?

---

<div class="post-metadata">

**Author:** ![emkajeej](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/emkajeej/32/51111_2.png) [@emkajeej](https://discourse.threejs.org/u/emkajeej)\
**Post date:** [August 20, 2024, 7:59pm UTC](https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497/4 "2024-08-20T19:59:57Z")

</div>

You are correct, I was painting with too broad strokes.

Depending on your setup, implementation, and tree shaking it may cause unwanted effects. But it also might be fine; hence a warning over a hard error.

---

<div class="post-metadata">

**Author:** ![drcmda](https://avatars.discourse-cdn.com/v4/letter/d/91b2a8/32.png) [@drcmda](https://discourse.threejs.org/u/drcmda)\
**Post date:** [August 21, 2024, 5:45am UTC](https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497/5 "2024-08-21T05:45:13Z")

</div>

i am not sure sure what you mean by unloaded, you don’t unload modules. the webgl context is closed is all. if you get double loads, which points to conflicting namespaces as in three comes from two or more sources, your build system is at fault or a dependency that has three misconfigured (three in dependencies instead of peerDependencies in package.json), or you have a mistake in fetching three yourself via cdns where you load it from someplace and then from another, or a dependency does. i would consume three via npm and vite, that is a pretty good guarantee that everything will work fine.

---

<div class="post-metadata">

**Author:** ![oscarsjo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/oscarsjo/32/50850_2.png) [@oscarsjo](https://discourse.threejs.org/u/oscarsjo)\
**Post date:** [August 21, 2024, 6:53am UTC](https://discourse.threejs.org/t/using-threejs-in-two-separate-blazor-imported-modules-throws-warning-multiple-instance-of-three-js-being-imported/69497/6 "2024-08-21T06:53:26Z")

</div>

It seems the issue was that three js was bundled (so the double import would load it twice), using importmaps solved the issue.

Thanks for the help and feedback everybody!