# zem > Create, test and publish Zeplin extensions with no build configuration Latest version **2.0.7** (published 2025-06-17) · MIT license · 0 weekly downloads ## Install ```sh npm install zem pnpm add zem yarn add zem bun add zem ``` Provides the command `zem`. ## Health **Score 30/100 (F)** — status: maintenance-mode. Positive: esm support; no vulnerabilities. Warnings: low downloads; no types. Negative: stale; low maintenance score. ## Facts | | | |---|---| | Version | 2.0.7 | | Published | 2025-06-17 | | First published | 2018-03-08 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | ESM | | Node | >=20 | | Dependencies | 29 | | Unpacked size | 402.1 KB | | Known vulnerabilities | 0 (+8 in 1 direct dependencies) | | Install scripts | no | | Maintainers | zeplin-npm, dirtybit | | Keywords | zeplin, zeplin-extension, extension | ## Links - npm: https://www.npmjs.com/package/zem - Repository: https://github.com/zeplin/zem - Homepage: https://zeplin.io - Issues: https://github.com/zeplin/zem/issues - npm.io page: https://npm.io/package/zem ## Dependencies (29) - [qs](https://npm.io/package/qs.md) ^6.14.0 - [ajv](https://npm.io/package/ajv.md) ^8.17.1 - [case](https://npm.io/package/case.md) ^1.6.3 - [jest](https://npm.io/package/jest.md) ^29.7.0 - [chalk](https://npm.io/package/chalk.md) ^5.4.1 - [undici](https://npm.io/package/undici.md) ^7.8.0 - [adm-zip](https://npm.io/package/adm-zip.md) ^0.5.16 - [ci-info](https://npm.io/package/ci-info.md) ^4.2.0 - [core-js](https://npm.io/package/core-js.md) ^3.41.0 - [prismjs](https://npm.io/package/prismjs.md) ^1.30.0 - [prompts](https://npm.io/package/prompts.md) ^2.4.2 - [resolve](https://npm.io/package/resolve.md) ^1.22.10 - [webpack](https://npm.io/package/webpack.md) ^5.99.7 - [fs-extra](https://npm.io/package/fs-extra.md) ^11.3.0 - [commander](https://npm.io/package/commander.md) ^14.0.0 - [babel-jest](https://npm.io/package/babel-jest.md) ^29.7.0 - [@babel/core](https://npm.io/package/@babel/core.md) ^7.26.10 - [ajv-formats](https://npm.io/package/ajv-formats.md) ^3.0.1 - [jest-config](https://npm.io/package/jest-config.md) ^30.0.0 - [babel-loader](https://npm.io/package/babel-loader.md) ^10.0.0 - [jsonwebtoken](https://npm.io/package/jsonwebtoken.md) ^9.0.2 - [webpack-merge](https://npm.io/package/webpack-merge.md) ^6.0.1 - [update-notifier](https://npm.io/package/update-notifier.md) ^7.3.1 - [@babel/preset-env](https://npm.io/package/@babel/preset-env.md) ^7.26.9 - [http-status-codes](https://npm.io/package/http-status-codes.md) ^2.3.0 - [webpack-dev-server](https://npm.io/package/webpack-dev-server.md) ^5.2.1 - [copy-webpack-plugin](https://npm.io/package/copy-webpack-plugin.md) ^13.0.0 - [eslint-webpack-plugin](https://npm.io/package/eslint-webpack-plugin.md) ^5.0.1 - [@zeplin/extension-model](https://npm.io/package/@zeplin/extension-model.md) ^3.0.2 ## Recent versions - 2.0.7 (latest) — 2025-06-17 - 2.0.0 (beta) — 2025-06-13 - 2.0.6 — 2025-06-17 - 2.0.5 — 2025-06-17 - 2.0.4 — 2025-06-16 - 2.0.3 — 2025-06-16 - 2.0.2 — 2025-06-16 - 2.0.1 — 2025-06-13 - 2.0.0-beta.3 — 2025-06-13 - 2.0.0-beta.2 — 2025-06-13 - 2.0.0-beta.1 — 2025-06-11 - 2.0.0-beta.0 — 2025-06-09 - 1.3.1 — 2021-11-16 - 1.3.0 — 2021-03-04 - 1.2.0 — 2021-01-21 - … 19 more at https://npm.io/package/zem/versions ## README # Zeplin Extension Manager Create, test and publish Zeplin extensions with no build configuration. ⚗️🦄 ## Getting started You can run Zeplin Extension Manager directly to create an extension: ```sh npx zem create my-extension ``` You can also use `-y` option to create package with default configuration. ```sh npx zem create my-extension -y ``` ## Overview Extensions created using the manager have built-in scripts to ease development, build, test and publish processes. No need to setup tools like Webpack or Babel—they are preconfigured and hidden by the manager. ### Scripts #### `npm start` Starts a local server, serving the extension (by default, at http://127.0.0.1:7070). Hostname, port and the list of hosts allowed to access the local server can be provided as options. Follow the [tutorial](https://zeplin.github.io/extension-model/documents/Tutorial.html) to learn how to add a local extension to a Zeplin project. ``` Usage: npm start -- [options] Options: -h --host Host name (default: localhost) -p --port Port (default: 7070) -a --allowed-hosts Allowed hosts ``` #### `npm run build` Builds extension source, creating resources targeting production environment. ``` Usage: npm run build -- [options] Options: -d --dev Target development environment ``` #### `npm run exec` Executes extension function(s) with sample data. This is a super useful script to debug and test your extension, without running in it Zeplin. ``` Usage: npm run exec -- [function-name] [options] Options: --no-build Use existing build. --defaults Set default extension option values (e.g, flag=false,prefix=\"pre\") ``` #### `npm test` Runs test scripts via Jest. Extension packages created using zem include a boilerplate test module. It uses Jest's snapshot testing feature to match the output of your extensions with the expected results. For example, you can take a look at our [React Native extension](https://github.com/zeplin/react-native-extension/blob/develop/src/index.test.js). ``` Usage: npm test -- [options] ``` You can check [Jest's docs](https://jestjs.io/docs/en/cli.html) for options. #### `npm run clean` Cleans build directory. #### `npm run publish` Publish extension, sending it for review to be listed on [extensions.zeplin.io](https://extensions.zeplin.io). ``` Usage: npm run publish -- [options] Options: --path Path for the extension build to publish (default: Path used by the build command) ``` ##### Usage with access token: Zeplin Extension Manager can authenticate using an access token instead of your Zeplin credentials which makes it easier to integrate it into your CI workflow. 1. Get a `zem` access token from your [Profile](https://app.zeplin.io/profile/connected-apps) in Zeplin. 2. Set `ZEM_ACCESS_TOKEN` environment variable in your CI. ## Tidbits - Modules are transpiled to target Safari 9.1, as extensions are run both on the Web app and on the Mac app using JavaScriptCore, supporting macOS El Capitan. - Add an ESLint configuration and the source code will automatically be linted before building. - You can create `webpack.zem.js` at your root to customize webpack config. The module should export a function that takes current webpack config as an argument and return customized webpack config. For example: ```javascript module.exports = function({ module: { rules, ...module }, ...webpackConfig }) { return { ...webpackConfig, resolve: { extensions: [".ts"] }, module: { ...module, rules: [ { test: /\.tsx?$/, use: "ts-loader", exclude: /node_modules/, }, ...rules, ], }, }; }; ``` ## Community solutions ### Zero [baybara-pavel/zero](https://github.com/baybara-pavel/zero) Similar to zem, Zero lets you quickly start working on a Zeplin extension with Webpack. --- _Source: https://npm.io/package/zem · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._