Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/AdobeXD/generator-xd-plugin
Yeoman generator for creating Adobe XD Plugin projects.
https://github.com/AdobeXD/generator-xd-plugin
adobe adobe-xd yeoman-generator
Last synced: 3 months ago
JSON representation
Yeoman generator for creating Adobe XD Plugin projects.
- Host: GitHub
- URL: https://github.com/AdobeXD/generator-xd-plugin
- Owner: AdobeXD
- License: apache-2.0
- Created: 2018-12-21T05:14:52.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T02:39:37.000Z (about 2 years ago)
- Last Synced: 2024-09-22T00:25:31.018Z (4 months ago)
- Topics: adobe, adobe-xd, yeoman-generator
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/generator-xd-plugin
- Size: 5.42 MB
- Stars: 12
- Watchers: 17
- Forks: 5
- Open Issues: 18
-
Metadata Files:
- Readme: README.md
- Contributing: .github/CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# generator-xd-plugin
[Yeoman](http://yeoman.io) generator for creating [Adobe XD Plugin](https://adobexdplatform.com/) 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](https://webpack.github.io/) and [xdpm (Adobe XD Plugin Manager Command Line Tool)](https://github.com/AdobeXD/xdpm).
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](https://www.adobe.com/products/xd.html) 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](http://yeoman.io) and generator-xd using [npm](https://www.npmjs.com/) (we assume you have pre-installed [node.js](https://nodejs.org/)).
```bash
npm install -g yo
npm install -g generator-xd-plugin
```## Usage
### Create an XD plugin project
```bash
yo xd-plugin
```### Developing plugins
Move to the project folder created by `yo xd-plugin`, and run following commands.
#### Install generated plugin
```bash
npm start
```You have to reload the plugin for Adobe XD by `Ctrl/Cmd+Shift+R`
#### Package into an xdx file
```bash
npm run package
```#### Validate manifest.json
```bash
npm run validate
```manifest.json is in `static` folder.
## yo xd-plugin DEMO
![](doc/generator-xd-plugin-demo-10sec.gif)
## Contributing
If you are interested in contributing, please start by reading the [Contributing Guidelines](.github/CONTRIBUTING.md).
### Development
Build your own generator and link updates.
```bash
git clone [email protected]:adobexd/generator-xd-plugin
cd generator-xd-plugin
npm link
cd ..
yo xd-plugin
```## License
Apache-2.0 © [Adobe](https://www.adobe.com/)
## 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](https://www.adobe.com/legal/terms.html) and the [Adobe Developer Additional Terms](https://wwwimages2.adobe.com/content/dam/acom/en/legal/servicetou/Adobe-Developer-Additional-Terms_en_US_20180605_2200.pdf).