baybara-pavel / zero

Boilerplate for Zeplin extension projects based on webpack

Start your Zeplin extension from Zero with Webpack.

If you want more power features without build process configuration – use official solution zem

Zero includes

• Base project file structure
• Webpack (dev watching & production minification)
• Babel
• Prettier
• Eslint (AirBnB & Prettier)
• EditorConfig
• Husky & Lint-staged (pre-commit hooks)

How to Start

First, you need last stable Node.js ^8.9.4. Follow this guide if you don't have any.

Next, install project dependencies:

npm install

To start developing run:

npm start

Result build will be at dist dir. To add your extension into local macOS Zeplin client follow the instruction from official tutorial. Path to your local extension be like:

file://[absolute_path_to_zero_project_folder]/dist/manifest.json

Don't forget to replace [absolute_path_to_zero_project_folder] with your folder absolute path.

And finally, to get production ready build of your extension, just replace Zero credantials in src/manifest.json to yours and run following:

npm run build

Project structure

zero
├── README.md
├── node_modules
├── package.json
├── package-lock.json
├── .eslintrc.js
├── .eslintignore
├── .prettierrc
├── .editorconfig
├── .gitignore
├── config
│   └── paths.js
│   └── webpack.common.js
│   └── webpack.dev.js
│   └── webpack.prod.js
├── dist                  <-- result extension build will be there
│   └── index.js
│   └── manifest.json
└── src
    └── _example-lib.js
    └── index.js
    └── manifest.json

Extensions builded with Zero

• Zepcode - Zeplin extension that generates Swift snippets from colors, fonts and layers

Authors

Baybara Pavel, [e-mail]

Artem Novichkov, [e-mail]

License

Zero is available under the MIT license. See the LICENSE file for more info.