> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/nrwl/nx/llms.txt
> Use this file to discover all available pages before exploring further.

# Nx plugins

> Learn what Nx plugins are, how they extend Nx with generators, executors, and project graph inference, and how to install and use them.

Nx plugins help developers integrate tools and frameworks with Nx. A plugin author who knows the best way to use a tool with Nx can codify that expertise and share it with the entire community. Plugins reduce the amount of configuration you need to write manually and keep it up to date automatically as tools evolve.

## What plugins can do

<CardGroup cols={2}>
  <Card title="Infer tasks" icon="sparkles">
    Automatically configure Nx cache settings, inputs, outputs, and task dependencies based on your existing tool configuration files. No manual `project.json` entries needed.
  </Card>

  <Card title="Generate code" icon="wand">
    Provide generators that scaffold new projects, add libraries, configure tools, or modify existing files. Run with `nx generate @nx/react:app myapp`.
  </Card>

  <Card title="Maintain dependencies" icon="refresh">
    Provide migrations that automatically update package versions and tooling configuration when you run `nx migrate`. For example, when Storybook introduced CSF3, the `@nx/storybook` plugin applied those changes automatically.
  </Card>

  <Card title="Enhance tooling with executors" icon="play">
    Run tools in ways that wouldn't be possible from the command line alone. For example, `@nx/js:tsc` combines Nx's workspace awareness with TypeScript's batch mode to make builds more performant.
  </Card>
</CardGroup>

## Official plugins

The Nx team maintains official plugins for major frameworks and tools. Install any of them with `nx add`:

```bash theme={null}
nx add @nx/react
nx add @nx/angular
nx add @nx/node
nx add @nx/next
nx add @nx/vue
nx add @nx/vite
nx add @nx/jest
nx add @nx/webpack
nx add @nx/playwright
nx add @nx/storybook
```

`nx add` installs the package, runs its initialization generator, and registers it in `nx.json`.

<Tabs>
  <Tab title="@nx/react">
    Supports React applications and libraries. Infers tasks from Vite or Webpack config. Provides generators for components, pages, and libraries.

    ```bash theme={null}
    nx add @nx/react
    nx generate @nx/react:app myapp --bundler=vite
    ```
  </Tab>

  <Tab title="@nx/angular">
    Full Angular support including Angular CLI compatibility. Provides generators for components, services, modules, and libraries.

    ```bash theme={null}
    nx add @nx/angular
    nx generate @nx/angular:app myapp
    ```
  </Tab>

  <Tab title="@nx/node">
    Node.js applications using Express, Fastify, Koa, or plain Node. Provides generators for APIs and serverless functions.

    ```bash theme={null}
    nx add @nx/node
    nx generate @nx/node:app myapi --framework=fastify
    ```
  </Tab>

  <Tab title="@nx/vite">
    Infers `build`, `serve`, `preview`, and `test` (via Vitest) tasks from `vite.config.ts`. Automatically configures cache inputs and outputs.

    ```bash theme={null}
    nx add @nx/vite
    ```
  </Tab>
</Tabs>

## Community plugins

The Nx community maintains hundreds of additional plugins. Browse them at the [Nx Plugin Registry](https://nx.dev/plugin-registry). Community plugins follow the same API as official plugins and can do everything official plugins can do.

## How plugins are registered

Plugins are listed in the `plugins` array in `nx.json`. When you run `nx add`, this entry is created automatically:

```json title="nx.json" theme={null}
{
  "plugins": [
    {
      "plugin": "@nx/vite/plugin",
      "options": {
        "buildTargetName": "build",
        "serveTargetName": "serve",
        "previewTargetName": "preview",
        "testTargetName": "test"
      }
    },
    {
      "plugin": "@nx/jest/plugin",
      "options": {
        "targetName": "test"
      }
    }
  ]
}
```

Plugins in this array are processed in order. If two plugins create a target with the same name for the same project, the plugin listed **last** wins.

## How plugins extend the project graph

Plugins participate in the project graph build process in two ways:

1. **Task inference** — A plugin's `createNodes` function scans the workspace for tool-specific config files (e.g., `vite.config.ts`, `jest.config.ts`) and creates project nodes and target configurations from them. See [Inferred Tasks](/concepts/inferred-tasks).

2. **Dependency detection** — A plugin's `createDependencies` function analyzes files to find relationships between projects that static import analysis alone cannot detect.

## Scoping plugins to specific projects

Use `include` and `exclude` glob patterns to apply a plugin only to certain projects:

```json title="nx.json" theme={null}
{
  "plugins": [
    {
      "plugin": "@nx/jest/plugin",
      "include": ["packages/**/*"],
      "exclude": ["**/*-e2e/**/*"]
    }
  ]
}
```

This is also useful for applying the same plugin twice with different options for different project groups.

## Building your own plugin

You can build a plugin for internal use or to share with the community. Nx provides a generator to scaffold a new plugin package:

```bash theme={null}
nx add @nx/plugin
nx generate @nx/plugin:plugin my-plugin
```

See [Build Your Own Plugin](https://nx.dev/extending-nx/organization-specific-plugin) for a complete walkthrough.