Clear
Back

Splitting Scripts Across Multiple Files

In Spark AR Studio you can split scripts across multiple files. This can be useful when you have large scripts or want to organize your files.

How to split scripts

All you need to do is keep adding script file assets. Each file will be executed in its own isolated scope and can’t share global variables with another file. This also means that the scripting console no longer has access to global variables in your script files.

You can share variables between files through standard JavaScript import/export syntax.

Exporting a variable

You can use any of the following:

// in file1.js


// This variable will not be visible in the scripting console
// Other files can't have access to this variable
var localVariable = 10

// To make symbols available to other files or scripting console

// Use export keyword
export function functionName() {}
export class ClassName {}

// Or use module.exports
module.exports = {
functionName,
ClassName
};

// export default syntax is also supported
export default function defaultFunction() {}
            

Referencing symbols in other files

Simply reference the file you want with relative paths. All files will reside in the same folder.


// in file2.js

const {
  functionName,
  ClassName 
} = require("./file1.js");

import defaultFunction, {
  functionName,
  ClassName,
} from "./file1.js";
                            

There’s no need to specify a "main" entry file. The build system will find any dependencies between files and execute them in order.

Scripting console

The scripting console no longer has access to global variables in the script file.

To access a variable in the scripting console, that variable needs to be exported from the script file. This is fully supported for single script file. For multiple script files, only the exported variables from the file that appears last in the asset tree will be accessible from the console.

JavaScript to patch bridging

Bridging to the Patch Editor works as before. The bridging variables are shared across all script files

Exceptions

We use source maps to remap error messages from the generated script file to their original location within the original file authored by the user.

Join the Spark AR Creator's community

Find inspiration, see examples, get support, and share your work with a network of creators.

Join Community

Join the Spark AR Creator's community

Find inspiration, see examples, get support, and share your work with a network of creators.

Join Community

Frequently asked questions

Have a specific question? Maybe it's been answered.


Read FAQs
Was this document helpful?