|
| 1 | +# CODING Toolkit |
| 2 | + |
| 3 | +## Installation |
| 4 | + |
| 5 | +- [Download](../../releases/latest/download/coding-toolkit.sketchplugin.zip) the latest release of the plugin |
| 6 | +- Un-zip |
| 7 | +- Double-click on coding-toolkit.sketchplugin |
| 8 | + |
| 9 | +## Development Guide |
| 10 | + |
| 11 | +_This plugin was created using `skpm`. For a detailed explanation on how things work, checkout the [skpm Readme](https://github.com/skpm/skpm/blob/master/README.md)._ |
| 12 | + |
| 13 | +### Usage |
| 14 | + |
| 15 | +Install the dependencies |
| 16 | + |
| 17 | +```bash |
| 18 | +npm install |
| 19 | +``` |
| 20 | + |
| 21 | +Once the installation is done, you can run some commands inside the project folder: |
| 22 | + |
| 23 | +```bash |
| 24 | +npm run build |
| 25 | +``` |
| 26 | + |
| 27 | +To watch for changes: |
| 28 | + |
| 29 | +```bash |
| 30 | +npm run watch |
| 31 | +``` |
| 32 | + |
| 33 | +Additionally, if you wish to run the plugin every time it is built: |
| 34 | + |
| 35 | +```bash |
| 36 | +npm run start |
| 37 | +``` |
| 38 | + |
| 39 | +### Custom Configuration |
| 40 | + |
| 41 | +#### Babel |
| 42 | + |
| 43 | +To customize Babel, you have two options: |
| 44 | + |
| 45 | +- You may create a [`.babelrc`](https://babeljs.io/docs/usage/babelrc) file in your project's root directory. Any settings you define here will overwrite matching config-keys within skpm preset. For example, if you pass a "presets" object, it will replace & reset all Babel presets that skpm defaults to. |
| 46 | + |
| 47 | +- If you'd like to modify or add to the existing Babel config, you must use a `webpack.skpm.config.js` file. Visit the [Webpack](#webpack) section for more info. |
| 48 | + |
| 49 | +#### Webpack |
| 50 | + |
| 51 | +To customize webpack create `webpack.skpm.config.js` file which exports function that will change webpack's config. |
| 52 | + |
| 53 | +```js |
| 54 | +/** |
| 55 | + * Function that mutates original webpack config. |
| 56 | + * Supports asynchronous changes when promise is returned. |
| 57 | + * |
| 58 | + * @param {object} config - original webpack config. |
| 59 | + * @param {boolean} isPluginCommand - whether the config is for a plugin command or a resource |
| 60 | + **/ |
| 61 | +module.exports = function(config, isPluginCommand) { |
| 62 | + /** you can change config here **/ |
| 63 | +} |
| 64 | +``` |
| 65 | + |
| 66 | +### Debugging |
| 67 | + |
| 68 | +To view the output of your `console.log`, you have a few different options: |
| 69 | + |
| 70 | +- Use the [`sketch-dev-tools`](https://github.com/skpm/sketch-dev-tools) |
| 71 | +- Run `skpm log` in your Terminal, with the optional `-f` argument (`skpm log -f`) which causes `skpm log` to not stop when the end of logs is reached, but rather to wait for additional data to be appended to the input |
| 72 | + |
| 73 | +### Publishing your plugin |
| 74 | + |
| 75 | +```bash |
| 76 | +skpm publish <bump> |
| 77 | +``` |
| 78 | + |
| 79 | +(where `bump` can be `patch`, `minor` or `major`) |
| 80 | + |
| 81 | +`skpm publish` will create a new release on your GitHub repository and create an appcast file in order for Sketch users to be notified of the update. |
| 82 | + |
| 83 | +You will need to specify a `repository` in the `package.json`: |
| 84 | + |
| 85 | +```diff |
| 86 | +... |
| 87 | ++ "repository" : { |
| 88 | ++ "type": "git", |
| 89 | ++ "url": "git+https://github.com/ORG/NAME.git" |
| 90 | ++ } |
| 91 | +... |
| 92 | +``` |
0 commit comments