Building an Nx Plugin to Add Dependencies to a Project

devinshoemaker profile image Devin Shoemaker Updated on ・2 min read

Nx community plugins are a powerful new technology by Nrwl that allows you to customize the functionality of Nx. If you have not yet watched Nrwl's official Nx Plugin guide then I highly recommend starting there.

When building an Nx Plugin you may want to add dependencies when a schematic is executed. Perhaps you need to add dependencies during an ng add command, or maybe you only want to add dependencies when a particular flag is passed into a schematic (such as whether routing will be enabled or not). Adding dependencies with an Nx Plugin is very easy using the @nrwl/workspace library provided by Nrwl.


First, add the addDepsToPackageJson library:

import { addDepsToPackageJson } from '@nrwl/workspace';

Next, create a new function that returns the addDepsToPackageJson function. This function accepts two arguments; a dependencies and devDependencies object to merge with the users package.json:

function addDependencies(): Rule {
  return addDepsToPackageJson(
      '@ionic/react': ionicReactVersion,
      ionicons: ioniconsVersion
      '@nxtend/ionic-react': nxtendVersion,
      '@testing-library/user-event': testingLibraryUserEventVersion,
      '@testing-library/jest-dom': testingLibraryJestDomVersion

In the example above, I am setting the library versions based on variables in a separate versions.ts file. This allows me to easily view and maintain what dependency versions my plugin is importing.

Finally, just execute this function in you schematic default function chain:

export default function(): Rule {
  return chain([


Adding a unit test for this is trivial. Here is an example from my @nxtend/ionic-react plugin:

describe('init', () => {
  let appTree: Tree;

  const testRunner = new SchematicTestRunner(
    join(__dirname, '../../../collection.json')

  beforeEach(() => {
    appTree = createEmptyWorkspace(Tree.empty());

  it('should add Ionic React dependencies', async () => {
    const result = await testRunner
      .runSchematicAsync('init', {}, appTree)
    const packageJson = readJsonInTree(result, 'package.json');

In this test we create a new workspace, execute the init schematic that executes the addDepsToPackageJson method, and then asserts that these dependencies are present in the package.json.


Nx Plugins are an exciting new technology with a lot of potential. Adding dependencies to a project with Nx Plugins is fairly simple, but feel free to check out my @nxtend/ionic-react Nx Plugin for more examples.



Nx Plugin Guide

@nxtend/ionic-react GitHub

Posted on May 29 by:

devinshoemaker profile

Devin Shoemaker


Full-stack developer, Nx Plugin author, streaming newbie


markdown guide