🍒 Cherry-Picked Nx v19 Updates

Exploring My Selected Features from Nx Releases

Jonathan Gelin
JavaScript in Plain English
4 min readMay 6, 2024

--

[🌊 Nx Core]

Metadata Property in Project Configuration

Already covered in my previous blog post on v18.3, Nx introduced a new metadata property in the project.json:

{
"name": "my-java-project",
"metadata": {
"technologies": ["java17"],
"ciRunner": "ubuntu-20.04-m6a.large",
"owners": ["backend-team"]
},
...
}

In Nx v19, you’ll be able to generate these metadata directly from your plugins:

export const createMetadata: CreateMetadata = (graph) => {
const metadata: ProjectsMetadata = {};
metadata['my-java-project'] = {
metadata: {
technologies: ['java17'],
ciRunner: 'ubuntu-20.04-m6a.large',
owners: ['backend-team']
}
}
return metadata;
}

This opens many possibilities for project customization like listing technologies or the runner you want to use on your CI.

It also helps define a project type described in my article 👥 Reproducible Nx Workspace with HugeNx’s Conventions.

Change imports for the Webpack plugin

It is always a better idea not to expose all utilities in the same index.ts especially when they are not related. It has an impact on the config loading for example.

Here is a good decision from Nx related to Webpack configurations:

Before

const { NxAppWebpackPlugin } = require('@nx/webpack');
const { NxReactWebpackPlugin } = require('@nx/react');

After

const { NxAppWebpackPlugin } = require('@nx/webpack/app-plugin');
const { NxReactWebpackPlugin } = require('@nx/react/webpack-plugin');

Global forwardAllArgs for nx:run-commands

Before, when you had multiple commands in your nx:run-commands executor, you had to specify for each command if you wanted or not to forward arguments:

    "configure-branch-environment": {
"executor": "nx:run-commands",
"options": {
"commands": [
{
"command": "echo \"BRANCH=$(git branch --show-current)\" > .local.env",
"forwardAllArgs": false
},
{
"command": "echo \"COMMIT_SHA=$(git rev-parse HEAD)\" >> .local.env",
"forwardAllArgs": false
},
{
"command": "ls",
"forwardAllArgs": false
},
{
"command": "cat .local.env",
"forwardAllArgs": false
}
],
"cwd": "{projectRoot}"
}
},

Now you can specify it globally:

    "configure-branch-environment": {
"executor": "nx:run-commands",
"options": {
"commands": [
"echo \"BRANCH=$(git branch --show-current)\" > .local.env",
"echo \"COMMIT_SHA=$(git rev-parse HEAD)\" >> .local.env",
"ls",
"cat .local.env"
],
"cwd": "{projectRoot}",
"forwardAllArgs": false
},
},

[🌐 nx.dev]

Main Navigation Menu

New Blog Page

https://nx.dev/blog

New Enterprise Page

https://nx.dev/enterprise

Related

In Plain English 🚀

Thank you for being a part of the In Plain English community! Before you go:

Sign up to discover human stories that deepen your understanding of the world.

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

--

--

Published in JavaScript in Plain English

New JavaScript and Web Development content every day. Follow to join our 3.5M+ monthly readers.

Written by Jonathan Gelin

Write & Share about SDLC/Architecture in Ts/Js, Nx, Angular, DevOps, XP, Micro Frontends, NodeJs, Cypress/Playwright, Storybook, Tailwind • Based in 🇪🇺

No responses yet

What are your thoughts?