{"id":13602439,"url":"https://github.com/oscarotero/node-sketch","last_synced_at":"2025-04-05T11:13:21.523Z","repository":{"id":44566782,"uuid":"91491653","full_name":"oscarotero/node-sketch","owner":"oscarotero","description":"💎 Javascript library to manipulate sketch files","archived":false,"fork":false,"pushed_at":"2021-07-26T02:15:17.000Z","size":4163,"stargazers_count":304,"open_issues_count":5,"forks_count":23,"subscribers_count":7,"default_branch":"master","last_synced_at":"2024-05-10T07:20:39.342Z","etag":null,"topics":["nodejs","sketch","sketchapp"],"latest_commit_sha":null,"homepage":"https://oscarotero.github.io/node-sketch/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/oscarotero.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-05-16T18:32:45.000Z","updated_at":"2024-01-31T22:36:47.000Z","dependencies_parsed_at":"2022-07-19T12:58:52.203Z","dependency_job_id":null,"html_url":"https://github.com/oscarotero/node-sketch","commit_stats":{"total_commits":146,"total_committers":7,"mean_commits":"20.857142857142858","dds":0.4931506849315068,"last_synced_commit":"22142dcf8ac1529cdc9b1ada1a3c3374777b39c9"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscarotero%2Fnode-sketch","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscarotero%2Fnode-sketch/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscarotero%2Fnode-sketch/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscarotero%2Fnode-sketch/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oscarotero","download_url":"https://codeload.github.com/oscarotero/node-sketch/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247325696,"owners_count":20920714,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["nodejs","sketch","sketchapp"],"created_at":"2024-08-01T18:01:23.280Z","updated_at":"2025-04-05T11:13:21.487Z","avatar_url":"https://github.com/oscarotero.png","language":"JavaScript","funding_links":[],"categories":["JavaScript","📦 Legacy \u0026 Inactive Projects"],"sub_categories":[],"readme":"# 💎 node-sketch\nJavascript library to manipulate sketch files\n\n[![Build Status](https://travis-ci.org/oscarotero/node-sketch.svg?branch=master)](https://travis-ci.org/oscarotero/node-sketch)\n\n## Install\n\n```sh\nnpm install node-sketch\n```\n\n## Example:\n\n```js\nconst ns = require('node-sketch');\n\nasync function run() {\n    const sketch = await ns.read(__dirname + '/design.sketch');\n\n    //Search the symbol named 'button'\n    const buttonSymbol = sketch.symbolsPage.get('symbolMaster', 'button');\n\n    //Search all instances of a symbol named 'old-button' and replace it with 'button'\n    const firstPage = sketch.pages[0];\n    \n    firstPage\n        .getAll('symbolInstance', instance =\u003e instance.symbolMaster.name === 'old-button')\n        .forEach(instance =\u003e instance.symbolMaster = buttonSymbol);\n\n    //Save the result\n    sketch.save('modified-design.sketch')\n        .then(console.log('File saved!!'));\n}\n\nrun();\n```\n\n## API\n\nTwo classes are used to manage sketch files:\n\n### `Sketch`\n\nRepresents the sketch file and contains all data (pages, symbols, styles, shapes, etc). Contains the method `.save()` to create a sketch file with the result.\n\n```js\nconst ns = require('node-sketch');\n\nns.read('input.sketch').then(sketch =\u003e {\n    sketch.document           // document data\n    sketch.meta               // meta data\n    sketch.user               // user data\n    sketch.pages              // array with all pages\n    sketch.symbolsPage        // the Symbols page\n    sketch.layerStyles        // array with the layer styles\n    sketch.textStyles         // array with the text styles\n    sketch.colors             // array containing the colors stored in the color palette\n    sketch.gradients          // array containing the gradients stored in the gradient palette\n    sketch.symbols            // array with all symbols stored in the document\n\n    sketch.foreignSymbols     // array with the symbols loaded from external libraries\n    sketch.foreignLayerStyles // array with the layer styles loaded from external libraries\n    sketch.foreignTextStyles  // array with the text styles loaded from external libraries\n\n    sketch.save('output.sketch');\n});\n```\n\n### `Node`\n\nIt's the base class used by all other elements. Any page, symbol, color, etc is an instance of this class.\n\n```js\nconst symbolsPage = sketch.symbolsPage;\n\nconsole.log(symbolsPage instanceof Node); //true \n\n//It include useful methods to search an inner node by class:\nconst button = symbolsPage.get('symbolMaster');\n\n//by class and name\nconst button = symbolsPage.get('symbolMaster', 'button');\n\n//by class and callback\nconst button = symbolsPage.get('symbolMaster', symbol =\u003e symbol.name === 'button');\n\n//Just a callback\nconst button = symbolsPage.get(node =\u003e node._class === 'symbolMaster' \u0026\u0026 node.name === 'button');\n\n//And the same than above but returning all inner nodes instead just the first:\nconst allSymbols = symbolsPage.getAll('symbolMaster');\n```\n\nThere are other classes extending `Node` to provide special funcionalities in some nodes, like `Style` or `SymbolInstance`.\n\n### JSON Scheme\n\nTechnically, the sketch format consist in a zip with some json files. To manipulate a sketch file with this library, you need to know the scheme of json. You can use this code to read and extract a sketch file into a directory, in order to inspect the json scheme:\n\n```js\nconst ns = require('../');\n\nns.read('demo.sketch').then(sketch =\u003e sketch.saveDir('demo'));\n```\nHere you can see [an example of extracted file](demos/scheme-explorer)\n\n### CLI\n\nStarting from v0.14.0, the command `node-sketch` was included to use the library from CLI. You only need a file named `node-sketch.js` exporting the function to manipulate a sketch file. For example:\n\n```js\nmodule.exports = sketch =\u003e {\n    //Convert the text style names to uppercase\n    sketch.textStyles.forEach(textStyle =\u003e {\n        textStyle.name = textStyle.name.toUpperCase();\n    })\n}\n```\nTo execute this script with the sketch file `my-styles.sketch`, run `node-sketch my-styles.sketch`.\nBy default, the file is readed, but not saved. If you want to override the file with the modifications, run `node-sketch my-styles.sketch --save`.\n\nAnd to execute a script file with a different name, use the `--script` argument: `node-sketch my-styles.sketch --script=my-script.js --save`.\n\n---\n\n[See the API detailed](https://oscarotero.github.io/node-sketch/)\n\nOr build it locally with `npm run docs`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foscarotero%2Fnode-sketch","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foscarotero%2Fnode-sketch","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foscarotero%2Fnode-sketch/lists"}