Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(core): update documentation for nx plugin options #19808

Merged
merged 1 commit into from
Oct 23, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 52 additions & 3 deletions docs/shared/recipes/plugins/project-graph-plugins.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ A simplified version of Nx's built-in `project.json` plugin is shown below, whic
```typescript {% fileName="/my-plugin/index.ts" %}
export const createNodes: CreateNodes = [
'**/project.json',
(projectConfigurationFile: string, context: CreateNodesContext) => {
(projectConfigurationFile: string, opts, context: CreateNodesContext) => {
const projectConfiguration = readJson(projectConfigurationFile);
const projectRoot = dirname(projectConfigurationFile);
const projectName = projectConfiguration.name;
Expand Down Expand Up @@ -97,7 +97,8 @@ It's more common for plugins to create new dependencies. First-party code contai
The shape of the [`createDependencies`](/nx-api/devkit/documents/CreateDependencies) function follows:

```typescript
export type CreateDependencies = (
export type CreateDependencies<T> = (
opts: T,
context: CreateDependenciesContext
) => CandidateDependency[] | Promise<CandidateDependency[]>;
```
Expand Down Expand Up @@ -166,7 +167,7 @@ Even though the plugin is written in JavaScript, resolving dependencies of diffe
A small plugin that recognizes dependencies to projects in the current workspace which a referenced in another project's `package.json` file may look like so:

```typescript {% fileName="/my-plugin/index.ts" %}
export const createNodes: CreateNodes = (ctx) => {
export const createDependencies: CreateDependencies = (opts, ctx) => {
const packageJsonProjectMap = new Map();
const nxProjects = Object.values(ctx.projectsConfigurations);
const results = [];
Expand Down Expand Up @@ -211,6 +212,54 @@ Breaking down this example, we can see that it follows this flow:
7. Pushes it into the located dependency array
8. Returns the located dependencies

## Accepting Plugin Options

When looking at `createNodes`, and `createDependencies` you may notice a parameter called `options`. This is the first parameter for `createDependencies` or the second parameter for `createDependencies`.

By default, its typed as unknown. This is because it belongs to the plugin author. The `CreateNodes`, `CreateDependencies`, and `NxPluginV2` types all accept a generic parameter that allows you to specify the type of the options.

The options are read from `nx.json` when your plugin is specified as an object rather than just its module name.

As an example, the below `nx.json` file specifies a plugin called `my-plugin` and passes it an option called `tagName`.

```json
{
"plugins": [
{
"name": "my-plugin",
"options": {
"tagName": "plugin:my-plugin"
}
}
]
}
```

`my-plugin` could then consume these options to add a tag to each project it detected:

```typescript
type MyPluginOptions = { tagName: string };

export const createNodes: CreateNodes<MyPluginOptions> = [
'**/project.json',
(fileName, opts, ctx) => {
const root = dirname(fileName);
const name = basename(fileName);

return {
projects: {
[name]: {
root,
tags: opts.tagName ? [opts.tagName] : [],
},
},
};
},
];
```

This functionality is available in Nx 17 or higher.

## Visualizing the Project Graph

You can then visualize the project graph as described [here](/core-features/explore-graph). However, there is a cache that Nx uses to avoid recalculating the project graph as much as possible. As you develop your project graph plugin, it might be a good idea to set the following environment variable to disable the project graph cache: `NX_CACHE_PROJECT_GRAPH=false`.
Expand Down
22 changes: 22 additions & 0 deletions docs/shared/reference/nx-json.md
Original file line number Diff line number Diff line change
Expand Up @@ -237,6 +237,28 @@ If you are using distributed task execution and disable caching for a given targ

{% /callout %}

### Plugins

Nx plugins can provide generators, executors, as well as modifying the project graph. Any plugin that modifies the project graph must be listed in the `plugins` array in `nx.json`. Plugins which modify the project graph generally either add nodes or dependencies to the graph.

This can be read about in more detail in the [plugins guide](/extending-nx/recipes/project-graph-plugins).

Inside `nx.json`, these plugins are either listed by their module path, or an object that references the plugin's module path and options that should be passed to it.

```json {% fileName="nx.json" %}
{
"plugins": [
"@my-org/graph-plugin",
{
"plugin": "@my-org/other-plugin",
"options": {
"someOption": true
}
}
]
}
```

### Generators

Default generator options are configured in `nx.json` as well. For instance, the following tells Nx to always
Expand Down