Skip to content

Getting Started

Jump to bottom
GarboMuffin edited this page Jan 22, 2021 · 46 revisions

These are the instructions for setting up the TurboWarp development environment on your own computer.

If you just want to use TurboWarp, visit https://turbowarp.org/. You don't need to follow these instructions.

Dependencies

Make sure you have these installed:

You might have to restart your terminal or computer for them to be fully installed.

Also note that Scratch, and by consequence TurboWarp, are very large and may take a lot of time, disk space, and bandwidth (gigabytes, plural).

Repos

TurboWarp is organized in the same way as Scratch. We fork a few of them to add our changes. Of note to TurboWarp:

  • TurboWarp/scratch-gui: the interface for the Scratch player and the TurboWarp website
  • TurboWarp/scratch-vm: the compiler
  • TurboWarp/scratch-render: Scratch's renderer with some relatively minimal changes

The process of getting each individual repo is essentially the same as Scratch, see: https://github.com/LLK/scratch-gui/wiki/Getting-Started

Getting the GUI

The GUI is the minimum to TurboWarp built.

# if you intend to modify the code and submit a PR, make a fork in GitHub and clone that repository instead
git clone https://github.com/TurboWarp/scratch-gui
cd scratch-gui
npm install
npm start

http://localhost:8601/

scratch-gui will load TurboWarp's forks of scratch-vm and scratch-render from GitHub automatically. However, you must obtain these separately if you wish to modify them.

Getting the VM and renderer

You do not need to do this if you are only interesting in scratch-gui.

# if you intend to modify the code and submit a PR, make a fork in GitHub and clone that repository instead
git clone https://github.com/TurboWarp/scratch-vm
git clone https://github.com/TurboWarp/scratch-render

cd scratch-vm
npm install
npm link
cd ..

cd scratch-render
npm install
npm link
cd ..

cd scratch-gui
npm link scratch-vm scratch-render

This will setup the repositories and link them so that scratch-gui will use your local versions instead of scratch-vm and scratch-render instead of the ones on GitHub.

Building for production

When deploying TurboWarp to a website, you should enable production mode. This will result in faster execution and a greatly reduced file size.

# in the `scratch-gui` folder

# mac, linux
NODE_ENV=production npm run build

# windows command prompt (untested)
set NODE_ENV=production
npm run build

# windows powershell
$env:NODE_ENV="production"
npm run build

By default TurboWarp generates links like https://turbowarp.org/editor.html#123 However, by setting ROOT=/ and ROUTING_STYLE=wildcard (in the same way that you set NODE_ENV=production), you can get routes like https://turbowarp.org/123/editor instead. Note that this requires a server that will setup the proper aliases. The webpack development server in scratch-gui is setup for this. For production you'd want something more like https://github.com/TurboWarp/turbowarp.org

The build output is in the build folder.

Clone this wiki locally