How does it work?

Ideally, this project should be an, OS independent, NodeJS library that allows to create valid Sketch files. Unfortunately, it's not possible at this point due to Sketch format limitations.

Current solution consists of two parts. First one (html2asketch) runs in a browser (either regular or headless) and creates an almost valid Sketch file (page.asketch.json and document.asketch.json). Second one (asketch2sketch) is a Sketch plugin that takes asketch.json files and imports them into Sketch.

Why two parts? html2asketch and asketch2sketch are built in different technologies and run in different environments. html2asketch is written in JavaScript and runs in a browser where it can easily extract all information from DOM nodes: their position, size, styles and children. Extracted information are then translated into Sketch's document.json and page.json files. Unfortunately, at the moment Sketch file format is not fully readable and some parts can't be easily generated from JavaScript (most notably text styling information which is saved as a binary blob). Additionally, the script running in the browser is limited by CORS and may not be able to download all of the images used on page. That's where we need asketch2sketch which is a Sketch plugin written in cocoascript (JavaScript + Objective-C). It "fixes" .asketch.json files (changes text styling information format, downloads and inlines images) and loads them into the Sketch app.

You can read more about .asketch format in the here.