# JSONLoader issues

**URL:** <https://discourse.threejs.org/t/jsonloader-issues/6783>\
**Category:** Questions\
**Tags:** typescript, loaders\
**Created:** [March 28, 2019, 12:25pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783 "2019-03-28T12:25:53Z")\
**Posts on this page:** 18\
**Page:** 1

<div class="post-metadata">

**Author:** ![michel83](https://avatars.discourse-cdn.com/v4/letter/m/f19dbf/32.png) [@michel83](https://discourse.threejs.org/u/michel83)\
**Post date:** [March 28, 2019, 12:25pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/1 "2019-03-28T12:25:53Z")

</div>

Hallo there,

In my project I use three in react (0.98) to render some json exported by blender 2.76 in order to produce images that I can modify with images in order on top of that to save the images and show them.  
The entire process is called mockuprenderer.  
Everything worked fine till the day that three js doesnt use anymore the objectloader and replace it with LegacyJSONloader. Unfortunately my problem is that there are no types relative to this loader and I need them because the project is written in typescript.  
Do you have some solution for that?

---

<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:** [March 28, 2019, 2:55pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/2 "2019-03-28T14:55:38Z")

</div>

> [@michel83](#):
>
> Everything worked fine till the day that three js doesnt use anymore the objectloader and replace it with LegacyJSONloader.

That’s is not entirely correct. `THREE.ObjectLoader` is still available and you can use it to load JSON in the Object/Scene format. `THREE.JSONLoader` was removed with `R99` from the core. It is now `THREE.LegacyJSONLoader` and part of the examples.

The problem is that you work with an exporter which was removed from the project almost a year ago. Because of this, you still need to work with `THREE.LegacyJSONLoader`. Have you considered to switch to a `glTF` based workflow instead?

I don’t think there will be type definitions for deprecated classes from the official side. You might want to use the following type definitions from another project. However, a few methods are missing (`.setPath()`, `.setResourcePath()` and `.setCrossOrigin()`).

> <https://github.com/DefinitelyTyped/DefinitelyTyped/blob/c9040913ba27f7d14ecc6572fb94df7c89808c05/types/three/three-core.d.ts#L2280-L2292>

---

<div class="post-metadata">

**Author:** ![michel83](https://avatars.discourse-cdn.com/v4/letter/m/f19dbf/32.png) [@michel83](https://discourse.threejs.org/u/michel83)\
**Post date:** [March 29, 2019, 5:49am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/3 "2019-03-29T05:49:03Z")

</div>

Hi Mugen87 thanks for the answer, you re totally right. It’s just that now redo all the project basing the thing on gtlf files is a little bit crazy. I have to review the entire project. so you think three js will not provide types in the future for LegacyJSONloader and because of this I should pass to gltf ?

---

<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:** [March 29, 2019, 10:02am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/4 "2019-03-29T10:02:02Z")

</div>

> [@michel83](#):
>
> so you think three js will not provide types in the future for LegacyJSONloader and because of this I should pass to gltf ?

Yes. But it’s not only about the types. Using `glTF` is the more robust and future-proof workflow. It’s also the recommended 3D format of the project. More details here:

[https://threejs.org/docs/index.html#manual/en/introduction/Loading-3D-models](https://threejs.org/docs/index.html#manual/en/introduction/Loading-3D-models)

---

<div class="post-metadata">

**Author:** ![ibty](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ibty/32/16635_2.png) [@ibty](https://discourse.threejs.org/u/ibty)\
**Post date:** [May 11, 2021, 1:55pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/5 "2021-05-11T13:55:05Z")

</div>

hello i am working with legacyJSONLoader and when i write this line of code \<‘import \* as THREE from’ [https://threejs.org/build/three.module.js](https://threejs.org/build/three.module.js)’ this error appears "Uncaught TypeError: THREE.LegacyJSONLoader is not a constructor " any suggestion please

---

<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:** [May 11, 2021, 2:15pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/6 "2021-05-11T14:15:08Z")

</div>

`LegacyJSONLoader ` was removed with `r111`. You can’t use the loader anymore with recent `three.js` versions. I highly recommend that you change your workflow towards glTF.

---

<div class="post-metadata">

**Author:** ![ibty](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ibty/32/16635_2.png) [@ibty](https://discourse.threejs.org/u/ibty)\
**Post date:** [May 11, 2021, 2:21pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/7 "2021-05-11T14:21:31Z")

</div>

thanks but i don’t know how can i change legacyJSOLoader to GLTF

---

<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:** [May 11, 2021, 6:29pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/8 "2021-05-11T18:29:21Z")

</div>

It depends a bit on how you originally have created your models.

- If you still have the Blender assets, it’s probably best to export to glTF.
- If you created the JSON files via `three.js`, go back to `r110`, load the JSON files and export to glTF via [THREE.GLTFExporter](https://threejs.org/docs/index.html?q=gltfe#examples/en/exporters/GLTFExporter).

---

<div class="post-metadata">

**Author:** ![ibty](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ibty/32/16635_2.png) [@ibty](https://discourse.threejs.org/u/ibty)\
**Post date:** [May 12, 2021, 2:28am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/9 "2021-05-12T02:28:13Z")

</div>

thank u , i have a JSON file i try with three js editor but does’nt work and also i go back to r110 nothing work too , is there another method to convert JSON file to GLTF?  
[gym-ceiling.js](https://discourse.threejs.org/uploads/short-url/kGTttEnIBt9nIy3JSKKSgTqlIKu.js) (514.5 KB)

---

<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:** [May 12, 2021, 7:41am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/10 "2021-05-12T07:41:30Z")

</div>

> [@ibty](#):
>
> i have a JSON file i try with three js editor but does’nt work

The latest editor is not able to load such a file. You have to use an older release.

And no, unfortunately there is no other way for converting.

---

<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:** [May 12, 2021, 7:46am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/11 "2021-05-12T07:46:30Z")

</div>

It seems to work fine with the editor of `r98` (the last release that contained `JSONLoader` in core).

[https://raw.githack.com/mrdoob/three.js/r98/editor/index.html](https://raw.githack.com/mrdoob/three.js/r98/editor/index.html)

This is the resulting glTF asset: [scene.glb](https://discourse.threejs.org/uploads/short-url/6CV7p0owEjTKt1N7SqjbJBCk7Nr.glb) (685.4 KB)

---

<div class="post-metadata">

**Author:** ![ibty](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ibty/32/16635_2.png) [@ibty](https://discourse.threejs.org/u/ibty)\
**Post date:** [May 12, 2021, 2:00pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/12 "2021-05-12T14:00:57Z")

</div>

thank u a lot \<3 \<3

---

<div class="post-metadata">

**Author:** ![ibty](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ibty/32/16635_2.png) [@ibty](https://discourse.threejs.org/u/ibty)\
**Post date:** [May 12, 2021, 3:25pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/13 "2021-05-12T15:25:20Z")

</div>

i tried to change the color of this but it doesn’t work how can i do it with this editor r98

---

<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:** [May 14, 2021, 9:24am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/14 "2021-05-14T09:24:21Z")

</div>

`gym-ceiling.js` has 256 different materials. You have to change the `color` property of all materials to see the effect that you want.

BTW: This type of model design is highly inefficient especially since all 256 material seems to have the same properties. I suggest you import the glb file into Blender, merge all parts of the geometry into a single entity, adjust the color and then export to glb again.

---

<div class="post-metadata">

**Author:** ![ibty](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ibty/32/16635_2.png) [@ibty](https://discourse.threejs.org/u/ibty)\
**Post date:** [May 15, 2021, 11:39pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/15 "2021-05-15T23:39:36Z")

</div>

thank u \<3 everything worked fine

---

<div class="post-metadata">

**Author:** ![ibty](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ibty/32/16635_2.png) [@ibty](https://discourse.threejs.org/u/ibty)\
**Post date:** [May 24, 2021, 6:25pm UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/16 "2021-05-24T18:25:48Z")

</div>

Hello, have u any Idea about GltfExporter because the same problème appears with GltfExporter when i add ‘import \* as …’ he don’t work, any suggestions !

---

<div class="post-metadata">

**Author:** ![Abraham\_Brookes](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/abraham_brookes/32/32913_2.png) [@Abraham\_Brookes](https://discourse.threejs.org/u/Abraham_Brookes)\
**Post date:** [January 29, 2023, 9:52am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/17 "2023-01-29T09:52:14Z")

</div>

For posterity, you can access this link to view an online three.js editor that has the JSONLoader and the GLTFExporter: [https://raw.githack.com/mrdoob/three.js/r98/editor/index.html](https://raw.githack.com/mrdoob/three.js/r98/editor/index.html)

Import your old json file using File \> Import and then export it using File \> Export GLB - nice!

However, this does not appear to work with rigging or animations - it just exports a static model so you may need to re-rig and animate your old assets

---

<div class="post-metadata">

**Author:** ![Vikas\_Sharma](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/vikas_sharma/32/36872_2.png) [@Vikas\_Sharma](https://discourse.threejs.org/u/Vikas_Sharma)\
**Post date:** [June 5, 2023, 10:11am UTC](https://discourse.threejs.org/t/jsonloader-issues/6783/18 "2023-06-05T10:11:45Z")

</div>

thanks alot for giving solution 🙂