# Error when trying to load Ktx textures with GLTFLoader and KTX2Loader

**URL:** <https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124>\
**Category:** Questions\
**Tags:** gltf-loader, textures\
**Created:** [November 30, 2020, 1:25pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124 "2020-11-30T13:25:07Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Joe\_Wiltshire](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/joe_wiltshire/32/14042_2.png) [@Joe\_Wiltshire](https://discourse.threejs.org/u/Joe_Wiltshire)\
**Post date:** [November 30, 2020, 1:25pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/1 "2020-11-30T13:25:08Z")

</div>

I’m trying to use ktx textures with the GLTFLoader but I’m getting errors on my page when using the KTX2Loader:

`Uncaught (in promise) ReferenceError: MSC_TRANSCODER is not defined`

Here’s how I’m implementing it, am I doing something wrong here?  
I can’t find any mention of other requirements for this setup, and there’s no function to “setTranscoderPath” of the ktx2loader, from what I understand it does this itself on init().

```
import { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader';
...
loader = new GLTFLoader();
var ktx2Loader = new KTX2Loader();
loader.setKTX2Loader(ktx2Loader);

```

Thanks for any help,  
Joe.

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [November 30, 2020, 1:30pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/2 "2020-11-30T13:30:18Z")

</div>

It seems you are missing the following line which is present in the [official example](https://threejs.org/examples/#webgl_loader_texture_ktx2).

```javascript
<script src="./js/libs/basis/msc_basis_transcoder.js"></script>

```

---

<div class="post-metadata">

**Author:** ![Joe\_Wiltshire](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/joe_wiltshire/32/14042_2.png) [@Joe\_Wiltshire](https://discourse.threejs.org/u/Joe_Wiltshire)\
**Post date:** [November 30, 2020, 3:53pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/3 "2020-11-30T15:53:19Z")

</div>

Hi Mugen,  
Just a note - My project uses node & modules so I’m not sure I can use the transcoder in the same way as the example.  
I’ve tried a few couple of different ways of including the transcoder, in my index.html:

```
<div id="WebGL"></div>
<script src="./Static/js/basis/msc_basis_transcoder.js"></script>
<script src="main.js"></script>

```

Or importing into main.js:

`import { MSC_TRANSCODER } from 'three/examples/js/libs/basis/msc_basis_transcoder.js';`

The file exists in both cases but I still get the same issue as before.

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [November 30, 2020, 5:19pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/4 "2020-11-30T17:19:01Z")

</div>

the msc basis transcoder is not a module, and cannot be imported, but can be added as a static `<script/>` tag in your HTML, as shown in the official example (which uses modules for everything else). If that is still not working for you, I think you’ll need to share a demo to debug.

---

<div class="post-metadata">

**Author:** ![Joe\_Wiltshire](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/joe_wiltshire/32/14042_2.png) [@Joe\_Wiltshire](https://discourse.threejs.org/u/Joe_Wiltshire)\
**Post date:** [December 1, 2020, 3:05pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/5 "2020-12-01T15:05:57Z")

</div>

Hi Don,

We’ve created a simplified repo example [Here](https://github.com/Uniform-Development/Research_KTX2)

Excuse any bad practices, we’re generally not web devs, at the end of the readme I’ve noted the key lines involving the KTX2Loading, the model can be found [here](https://github.com/Uniform-Development/Research_KTX2/tree/main/static/assets/3dmodels).  
Note - The model does seem to load perfectly on your gltf viewer so there’s nothing inherently wrong there.

Let me know if you can see anything wrong with our KTX2 implementation, cheers 🙂

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [December 1, 2020, 7:41pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/6 "2020-12-01T19:41:32Z")

</div>

Parcel.js doesn’t like scripts with global exports, and (for the moment) `msc_basis_transcoder.js` really requires that. I had to do a small hack to work around this in my own viewer:

> <https://github.com/donmccurdy/three-gltf-viewer/blob/bf23472b1deddb9904739530bfebf45fef313f67/index.html#L13-L18>

… also note that Parcel.js also requires some configuration for static files, and in this case the msc\_basis\_transcode is being treated as a static file. Here’s how I set that up:

> <https://github.com/donmccurdy/three-gltf-viewer/blob/bf23472b1deddb9904739530bfebf45fef313f67/package.json#L57-L63>

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [December 1, 2020, 7:42pm UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/7 "2020-12-01T19:42:02Z")

</div>

^I expect this will work more like a normal script in future versions of the transcoder, by the way.

---

<div class="post-metadata">

**Author:** ![Joe\_Wiltshire](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/joe_wiltshire/32/14042_2.png) [@Joe\_Wiltshire](https://discourse.threejs.org/u/Joe_Wiltshire)\
**Post date:** [December 3, 2020, 10:47am UTC](https://discourse.threejs.org/t/error-when-trying-to-load-ktx-textures-with-gltfloader-and-ktx2loader/21124/8 "2020-12-03T10:47:34Z")

</div>

This solved the problem for us, thanks for the help guys!  
Just for reference if anyone else comes here with the same problem as the repo may not stay public, we had to replace the script tag in the original example’s index.html with:

```
<script>
// Appended programmatically, to avoid letting Parcel compile this.
const scriptEl = document.createElement('script');
scriptEl.src = 'assets/msc_basis_transcoder.js';
document.head.appendChild(scriptEl);
</script>

```

For this to work we had to include the files **msc\_basis\_transcoder.js** and **msc\_basis\_transcoder.wasm** in our static/assets/ folder for parcel - for us these files were located in this folder **node\_modules\three\examples\js\libs\basis**

We do still occasionally get the “MSC\_TRANSCODER is not defined” error but to me that seems like an order of operations issue and we may just have to delay our model load until the msc\_transcoder in index has fully been loaded in.

For everything else the example worked as expected.
