diff --git a/docs/shared/recipes/plugins/create-preset.md b/docs/shared/recipes/plugins/create-preset.md index 6d421da6f4f28..a409a546f5eb1 100644 --- a/docs/shared/recipes/plugins/create-preset.md +++ b/docs/shared/recipes/plugins/create-preset.md @@ -1,4 +1,4 @@ -## Preset +# Create a Custom Plugin Preset When you create a new nx workspace, you run the command: [`npx create-nx-workspace`](/packages/nx/documents/create-nx-workspace). This command accepts a `--preset` option, for example: `npx create-nx-workspace --preset=react-standalone`. @@ -9,30 +9,32 @@ src="https://www.youtube.com/embed/yGUrF0-uqaU" title="Develop a Nx Preset for your Nx Plugin" width="100%" /%} -### Custom Preset +## What is a preset? -At its core a preset is a generator, which we can create inside of a plugin. +At its core, a preset is a special [generator](/plugin-features/use-code-generators) that is shipped as part of an Nx Plugin package. -All first-party Nx presets are built into nx itself, but you can [create your own plugin](/plugins/intro/getting-started) and create a generator with the magic name: `preset`. Once you've [published your plugin](/plugins/tutorials/publish-plugin) on npm, you can now run. the create-nx-workspace command with the preset option set to the name of your published package. +All first-party Nx presets are built into Nx itself, but you can [create your own plugin](/plugins/intro/getting-started) and create a generator with the magic name: `preset`. Once you've [published your plugin](/plugins/tutorials/publish-plugin) on npm, you can now run the `create-nx-workspace` command with the preset option set to the name of your published package. -For example, take +To use a concrete example, let's look at the [`qwik-nx`](https://www.npmjs.com/package/qwik-nx) Nx community plugin. They include a [preset generator](https://github.com/qwikifiers/qwik-nx/tree/main/packages/qwik-nx/src/generators/preset) that you can use to create a new Nx workspace with Qwik support. ```shell npx create-nx-workspace --preset=qwik-nx ``` -This command will create a new Qwik preset based on the [published npm package: `qwik-nx`](https://www.npmjs.com/package/qwik-nx). If we check this package's source code, we can see that it has a [generator named `preset`](https://github.com/qwikifiers/qwik-nx/tree/main/packages/qwik-nx/src/generators/preset). +## Create a new Nx plugin If you **don't** have an existing plugin you can create one by running ```shell - npx create-nx-plugin my-org --pluginName my-plugin +npx create-nx-plugin my-org --pluginName my-plugin ``` +## Creating a "Preset" generator + To create our preset inside of our plugin we can run ```shell - nx generate @nx/plugin:generator --name=preset --project=happynrwl +nx generate @nx/plugin:generator --name=preset --project=happynrwl ``` {% callout type="warning" title="Double check" %} @@ -90,7 +92,7 @@ export default async function (tree: Tree, options: PresetGeneratorSchema) { To get an in-depth guide on customizing/running or debugging your generator see [local generators](/plugins/recipes/local-generators). -#### Usage +## Usage Before you are able to use your newly created preset you must package and publish it to a registry.