How to compile scratch-editor?

nembence

I've remixed Scratch, and I'd like to try it out. How can I turn it into something that runs in the browser?

Last edited by nembence (Aug. 14, 2025 16:11:50)

MonkeyBean2

the individual repos had better documentation for building it and whatever, maybe take a look there? (scratch-gui specifically)

AHypnoman

not sure how to get it all running, but you can still run the individual packages within it (or at least scratch-gui) as before – load it standalone and run npm start, then go to localhost:8601

Maximouse

First, run the following in the scratch-editor directory:

npm install
npm run build

The build output will be in packages/scratch-gui/build/index.html.

You can then start the dev server by running npm start in packages/scratch-gui as explained by AHypnoman above. This will automatically recompile everything when you make a change to the code. If you open localhost:8601 in the browser, it will also automatically reload.

nembence

Thanks for the answers!
It looks like I would need Node.js, but I don't really want to install things rn so I'll probably do other things instead

I've deleted the remix because it looked confusing, almost as if I've made the Scratch editor (which I haven't)

nembence

ok so I've installed Node.js, downloaded the scratch-editor github as a zip file and decompressed it into a folder and I ran “npm install”.

Is it normal that it gives so many (53) warnings?

– removed the console output because it “appears to include unsuitable language and will not be posted.” –

and it says “108 vulnerabilities (7 low, 43 moderate, 34 high, 24 critical)”

and the node_modules folder is now full of things that I don't know what they do like “airbnb-prop-types”
If I do “npm run build” will all of these things do something? How can I know that it won't harm the computer

Last edited by nembence (Sept. 4, 2025 20:12:58)

Pufferfish_Test

nembence wrote:
(#6)
Is it normal that it gives so many (53) warnings?

yep

and it says “108 vulnerabilities (7 low, 43 moderate, 34 high, 24 critical)”

also normal. the scratch codebase is pretty old in terms of dependencies.

and the node_modules folder is now full of things that I don't know what they do like “airbnb-prop-types”
If I do “npm run build” will all of these things do something? How can I know that it won't harm the computer

some if those things will actually run stuff during the build process. others will run when you run yhe dev server, and others will be bundled up and used in your browser when you load the editor. You're right to be concerned, but it's probably fine as nobody else has had any problems (as far as I know…). If you want to be doubly sure, you could try running it all as a less privileged user, or investigate setting up a virtual machine or similar.

nembence

I ran “npm run build” and it output a lot of stuff and it stopped with this error and there is no build folder in packages/scratch-gui

> @scratch/scratch-gui@11.6.0 build:dev
> BUILD_TYPE=dev webpack

'BUILD_TYPE' is not recognized as an internal or external command,
operable program or batch file.
npm error Lifecycle script `build:dev` failed with error:
npm error code 1
npm error path C:\...\scratch-editor-develop\packages\scratch-gui
npm error workspace @scratch/scratch-gui@11.6.0
npm error location C:\...\scratch-editor-develop\packages\scratch-gui
npm error command failed
npm error command C:\WINDOWS\system32\cmd.exe /d /s /c BUILD_TYPE=dev webpack
npm error Lifecycle script `build` failed with error:
npm error code 1
npm error path C:\...\scratch-editor-develop\packages\scratch-gui
npm error workspace @scratch/scratch-gui@11.6.0
npm error location C:\...\scratch-editor-develop\packages\scratch-gui
npm error command failed
npm error command C:\WINDOWS\system32\cmd.exe /d /s /c npm run clean && npm run build:dev && npm run build:dist && npm run build:dist-standalone

How do I fix this? (sorry I'm new to npm)

Maximouse

Try changing line 42 of package.json (starting with “build:dev”) to the following:

"build:dev": "cross-env BUILD_TYPE=dev webpack",

Alternatively, you can use Windows Subsystem for Linux to run the commands in a Linux environment.

nembence

Thanks, this worked, but it takes more than 20 minutes to compile every time I change something, is there a way to speed that up?

Edit: never mind, I tried “npm start” and it compiles much faster

Last edited by nembence (Sept. 5, 2025 16:05:19)

MonkeyBean2

Pufferfish_Test wrote:
… snip … If you want to be doubly sure, you could try running it all as a less privileged user, or investigate setting up a virtual machine or similar.

You could also run it in docker, for some level of isolation

Discuss Scratch