Export scene from main.js file and import in other module js file

I am new to three.js and as well as javascript.
can we export scene object and import it in another js module file.
and if yes how can i do that?
is there any example regarding this?

You can export a scene by calling:

const json = scene.toJSON();

If necessary, you can then convert the JSON into a string by using JSON.stringify( json ). The string can be converted back by using JSON.parse(). The resulting object can be transformed to a three.js scene by using ObjectLoader.parse(). Check out the following demo that shows a complete round-trip:

https://jsfiddle.net/6ysg507r/

Instead of using the three.js JSON format, you can also consider to use a 3D format like glTF to export and import objects.

ohk. thanks for your help.
can we do like this.

can we export scene, camera, controls etc. from “main.js” file where all three.js work is done.

export { scene, camera, controls }

and import to other “viewerFunction.js” module file to use camera and controls to do other work like changing camera position.

import {scene, camera, controls} from “/main.js”

Reason behind this I have to cut my code from "main.js " and put it into another js file according to some function.

Were you able to export the scene to another js file, using export-import?

There is no problem with doing this using normal ES Module syntax. Variables referencing three.js objects are still just variables. If you’re having trouble with a particular project, I would recommend starting a new thread with details including your code so that others can help you figure out what might be wrong.

1 Like