Overview:
The HTMLifier is a tool designed to convert Scratch 3.0 projects into HTML files. By packaging all project data and the Scratch engine into a single file, it provides a way to run Scratch projects outside of the Scratch platform. This conversion process involves fetching project assets, converting them into base64 data URIs, and integrating them into a template HTML file.
Features:
- Converts Scratch 3.0 projects to HTML files: Enables running Scratch projects outside the Scratch environment.
- Uses Scratch VM to fetch project assets: Tracks assets fetched from the project.json for conversion.
- Creates base64 data URIs for project assets and project.json: Embeds project data into the HTML file.
- Includes Scratch engine in the generated HTML file: Ensures projects run with the necessary engine components.
- Supports NPMPackage installation: Available for easy installation as an npm package.
- Utilizes CSS by Mr. Cringe Kid and Scratch engine from scratch-vm: Incorporates necessary components for project conversion.
- Utilizes JSZip for downloading projects as zip files: Provides an option for downloading the converted projects in a zip format.
Installation:
To install the HTMLifier theme, follow these steps:
- Install the HTMLifier npm package by running the following command:
npm install htmlifier
- Include the necessary CSS by Mr. Cringe Kid and Scratch engine from scratch-vm in your project.
- Use JSZip for downloading the converted projects as zip files.
Summary:
The HTMLifier is a useful tool for converting Scratch 3.0 projects into HTML files, allowing users to run their projects outside the Scratch platform. By utilizing a combination of Scratch VM, base64 data URIs, and a template HTML file, it provides an accurate conversion of projects while sacrificing speed and editability. For users looking for faster alternatives, Scratch to JavaScript compilers like Phosphorus, Forkphorus, and TurboWarp are available, while LeopardDevelopment offers a Scratch to JavaScript converter best suited for learning JavaScript. Modifications in the source files may require re-bundling everything for the HTMLifier to function correctly.