Configuration Files

There are some advanced use cases where you might need more control over a sandbox or template. That's why we support configuration files. Every template on CodeSandbox has a list of configuration files it supports. You can see the supported files under Configuration Files from the left-hand activity bar in the editor.

Configurations File UI

Configuration UI

Some configuration files can be configured using a UI. This UI will generate a configuration file based on its state.

Configurations File UI

Sandbox Configuration

A sandbox can be configured too, you can do this with sandbox.config.json. We support these options:

OptionDescriptionPossible ValuesDefault Value
infiniteLoopProtectionWhether we should throw an error if we detect an infinite looptrue / falsetrue
hardReloadOnChangeWhether we should refresh the sandbox page on every change, good for sandboxes with global statetrue / falsefalse
templateWhich sandbox template to usesee here (opens in a new tab)smart detection, w/ fallback to "create-react-app"
viewWhich view to show first in the previewClient: "browser" / "console" / "problems" / "tests"
Container: "browser" / "console" / "problems" / "terminal"
disableLoggingWhether we should disable in-browser logging and have all logs created by the sandbox go to the browser consoletrue / falsefalse
containerThe container object contains the port, start script and Node.js major version, for example: "container": { "port": 3212, "startScript": "custom", "node": "14" }
portThe main port which the browser window listens to1024 - 65535First opened port inside the container.
startScriptExplicitly specify the start script used in a container sandbox, overriding the default valueA String matching a script name defined under "scripts" in package.json"dev" / "develop" / "serve" / "start"
nodeThe Node.js major version to use inside the container. The exact versions used are as follows:
"10": 10.24.1
"12": 12.22.7
"14": 14.18.1
"16": 16.12.0
"10" / "12" / "14" / "16""14"