https://github.com/xaviervia/sketch-loader
Webpack loader for Sketch (+43) files
https://github.com/xaviervia/sketch-loader
sketchapp webpack webpack-loader
Last synced: 10 months ago
JSON representation
Webpack loader for Sketch (+43) files
- Host: GitHub
- URL: https://github.com/xaviervia/sketch-loader
- Owner: xaviervia
- License: mit
- Created: 2017-03-16T18:42:58.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-03-19T11:18:43.000Z (over 9 years ago)
- Last Synced: 2025-07-07T08:14:43.250Z (12 months ago)
- Topics: sketchapp, webpack, webpack-loader
- Language: JavaScript
- Size: 83 KB
- Stars: 68
- Watchers: 3
- Forks: 3
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# sketch-loader
[](https://travis-ci.org/xaviervia/sketch-loader/builds) [](https://www.npmjs.com/package/sketch-loader)
Webpack loader for Sketch (+43) files
```
npm install --save sketch-loader
```
```javascript
module: {
loaders: [
{
test: /\.sketch$/,
loader: 'sketch'
}
]
}
```
Then importing:
```javascript
import sketchFile from './some-file.sketch'
sketchFile.document // parsed contents of document.json
sketchFile.user // parsed contents of user.json
sketchFile.meta // parsed contents of meta.json
sketchFile.pages['0F364A54-A488-4D6F-BAA4-F93FB057C5A3'] // parsed contents of pages/0F364A54-A488-4D6F-BAA4-F93FB057C5A3.json, and so on for every page file
```
You can check the example in [examples/simple/sagui.config.js](examples/simple/sagui.config.js)
## What is the structure of the contents?
As far as I know, there is no official documentation yet.
Meanwhile here you can find [Flowtype definitions for Sketch 43+ JSON](https://github.com/darknoon/sketchapp-json-flow-types/blob/master/types.js) by @darknoon to use as guide.
## License
MIT License