0
Fork 0
mirror of https://github.com/penpot/penpot-plugins.git synced 2025-01-08 07:50:44 -05:00

Update README.md

Improve penpot-plugins docs on how to launch sample plugins.
This commit is contained in:
Xaviju 2024-06-14 13:32:55 +02:00 committed by GitHub
parent 0776ca671c
commit 1e940dd543
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -24,43 +24,26 @@ npm run start:styles-example
Open in your browser: `http://localhost:4202/` Open in your browser: `http://localhost:4202/`
## Create a plugin from scratch or run the examples from the apps folder ## Run Penpot sample plugins
First of all it's necessary to have penpot running locally, you can check the steps [here](https://help.penpot.app/technical-guide/developer/devenv/) This guide will help you launch a Penpot plugin from the penpot-plugins repository. Before proceeding, ensure that you have Penpot running locally by following the [setup instructions](https://help.penpot.app/technical-guide/developer/devenv/).
Once you've done the previous step, you'll need to move to the following [branch](https://github.com/penpot/penpot/tree/niwinz-poc-plugins) as we still have the penpot part WIP In the terminal, navigate to the **penpot-plugins** repository and run `npm install` to install the required dependencies.
Remember to run penpot: Then, run `npm start` to launch the plugins wrapper.
``` After installing the dependencies, choose a plugin to launch. You can either run one of the provided examples or create your own (see "Creating a plugin from scratch" below).
./manage.sh pull-devenv To launch a plugin, Open a new terminal tab and run the appropriate startup script for the chosen plugin.
./manage.sh run-devenv
```
Then, you need to run `npm start` in the penpot-plugins repository. For instance, to launch the Contrast plugin, use the following command:
At this point, you have 2 choices:
- if you want to run the examples you should run:
```
// for the example plugin
npm run start:example
or
npm run start:pc-plugin
```
or
``` ```
// for the contrast plugin // for the contrast plugin
npm run start:contrast-plugin npm run start:plugin:contrast
``` ```
Open in your browser: `http://localhost:4210/` Finally, open in your browser the specific port. In this specific example would be `http://localhost:4302`
- if you want to create a new plugin, read the following [README](docs/create-plugin.md) A table listing the available plugins and their corresponding startup commands is provided below.
## Sample plugins ## Sample plugins
@ -81,6 +64,10 @@ Open in your browser: `http://localhost:4210/`
| plugins-runtime | Runtime for the plugins subsystem | 4200 | npm run start:app:runtime | | | plugins-runtime | Runtime for the plugins subsystem | 4200 | npm run start:app:runtime | |
| example-styles | Showcase of some of the Penpot styles that can be used in plugins | 4201 | npm run start:app:styles-example | http://localhost:4201/ | | example-styles | Showcase of some of the Penpot styles that can be used in plugins | 4201 | npm run start:app:styles-example | http://localhost:4201/ |
## Creating a plugin from scratch
If you want to create a new plugin, read the following [README](docs/create-plugin.md)
## License ## License
``` ```