generator-xd-plugin

Yeoman generator for creating Adobe XD Plugin

Usage no npm install needed!

<script type="module">
  import generatorXdPlugin from 'https://cdn.skypack.dev/generator-xd-plugin';
</script>

README

generator-xd-plugin

Yeoman generator for creating Adobe XD Plugin projects.

XD plugins extend the capabilities of Adobe XD by adding new features to the app, automating workflows, connecting the app to external services, and more.

This generator simply creates the scaffolding of files for XD Plugin using webpack and xdpm (Adobe XD Plugin Manager Command Line Tool).

Also, this project provides live-reloading of plugins. So that developers do not have to copy their plugin project files into develop folder. Developers may start coding almost as same style as webpack-dev-server.

About Adobe XD

Adobe XD is made for designers, by designers. It’s the fastest way to design, prototype, and share any user experience, from websites and mobile apps to voice interactions, and more.

Installation

First, install Yeoman and generator-xd using npm (we assume you have pre-installed node.js).

npm install -g yo
npm install -g generator-xd-plugin

Usage

Create an XD plugin project

yo xd-plugin

Developing plugins

Move to the project folder created by yo xd-plugin, and run following commands.

Install generated plugin

npm start

You have to reload the plugin for Adobe XD by Ctrl/Cmd+Shift+R

Package into an xdx file

npm run package

Validate manifest.json

npm run validate

manifest.json is in static folder.

yo xd-plugin DEMO

Contributing

If you are interested in contributing, please start by reading the Contributing Guidelines.

Development

Build your own generator and link updates.

git clone git@github.com:adobexd/generator-xd-plugin
cd generator-xd-plugin
npm link
cd ..
yo xd-plugin

License

Apache-2.0 © Adobe

DISCLAIMER

You use this utility at your own risk. Under no circumstances shall Adobe be held liable for the use, misuse, or abuse of this utility.

Use of this utility means that you agree to Adobe's Terms of Use and the Adobe Developer Additional Terms.