65
Per-project configuration, Storybook support for Angular 12, auto-refresh for Dependency Graph, and more in Nx 12.5!
Nx 12.5 includes many new features, including Per-project configuration, Storybook support for Angular 12, and more!
Nx is a smart, extensible build framework to help you architect, test, and build at any scale - integrating seamlessly with modern technologies and libraries while providing a robust CLI, computation caching, dependency management, and more.
Traditionally, in Nx workspaces, configuration for all projects is all contained in
workspace.json
and nx.json
files. For medium to large workspaces, these can be a source of merge conflicts, and limiting for existing repository structures. We've wanted to make this more flexible and scale easier for a long time, and have introduced per-project configuration in Nx workspaces using project.json
files. Project configurations can be independent files, referenced by
workspace.json
. For instance, a workspace.json
may contain projects configured as below.{
"projects": {
"mylib": "libs/mylib"
}
}
This tells Nx that all configuration for that project is found in the
libs/mylib/project.json
file. This file contains a combination of the project's configuration from both workspace.json
and nx.json
, making projects
in the root nx.json
optional.{
"root": "libs/mylib/",
"sourceRoot": "libs/mylib/src",
"projectType": "library",
"targets": {},
"tags": [],
"implicitDependencies": []
}
Independent project configurations provide more flexibility for projects, and less possibility of merge conflicts for larger workspaces. Integration and autocompletion still work as intended with Nx Console.
Generating new standalone projects is done by passing the
--standaloneConfig
flag.nx g @nrwl/react:app my-app --standaloneConfig
To convert your existing workspace to a per-project configuration, use the
convert-to-nx-project
generator.nx g @nrwl/workspace:convert-to-nx-project --all
Alternatively, you can convert individual projects with the
--project
flag.nx g @nrwl/workspace:convert-to-nx-project --project my-project

Storybook v6 moves from "knobs" to args and controls when it comes to defining and manipulating your storybook component properties. More can be found on the official Storybook docs.
From Nx v12.5 and on, the
@nrwl/storybook
package will be using @storybook/addon-controls
instead of @storybook/addon-knobs
to generate stories.storybook-configuration
generator will install the @storybook/addon-essentials
package, part of which is @storybook/addon-controls
. This includes some more "essential" Storybook features such as docs. To disable features you do not need anytime in your main.js
.nx migrate
to the latest version, your package.json
will be updated to include the @storybook/addon-essentials
package. The @storybook/addon-essentials
addon will be added in your addons
array in your root main.js
file. You will need to run npm/yarn install
to have it installed.@nrwl/storybook
, @nrwl/workspace
and @nrwl/angular
or @nrwl/react
, you will need to manually do yarn add -D @storybook/addon-essentials
. You will also need to add the addon manually in your addons
array in your root main.js
file.The Nx dependency graph is the way to always get an instant view of the dependencies between projects in your Nx workspace. We've added the additional functionality of auto-refresh to the dependency graph, so you can see changes made to new and existing projects as they occur.

Keeping our documentation up-to-date is something we put a lot of work and effort into maintaining. We have revamped our Nx website, which is now built with Next.js!

This has also given us the ability to see new documentation change previews in pull requests, making the contribution process easier for our community of contributors.
nx.json
, workspace.json
, and tsconfig.base.json
.Updating Nx is done with the following command, and will update your Nx workspace dependencies and code to the latest version:
nx migrate latest
After updating your dependencies, run any necessary migrations.
nx migrate --run-migrations
As always, if you are looking for enterprise consulting, training and support, you can find out more about how we work with our clients here.
65