@nx/webpack - Migrations

For an overview of the plugin and setup instructions, see the @nx/webpack introduction.

The @nx/webpack plugin provides various migrations to help you migrate to newer versions of webpack projects within your Nx workspace. Below is a complete reference for all available migrations.

24.0.x

remove-deprecated-executors

Version: 24.0.0-beta.3

Converts targets using the removed @nx/webpack executors to inferred tasks; an AI prompt finishes the targets the converter cannot convert safely and validates the project graph.

Convert @nx/webpack build and dev-server targets to inferred tasks

Nx 24 removes the @nx/webpack:webpack and @nx/webpack:dev-server executors and their @nrwl aliases. The migration registers @nx/webpack/plugin in nx.json and converts the targets that use those executors to inferred tasks. It moves the executor options into webpack.config.*. A target with nothing left to override is removed from project configuration. When several projects share the same remaining options, those options move to a targetDefaults entry scoped to the plugin. targetDefaults entries keyed by a removed executor are removed once no target uses that executor.

The migration lists the targets the converter cannot convert safely. In agentic runs, an AI prompt finishes them and validates the project graph.

The @nx/webpack:ssr-dev-server executor stays.

Sample code changes

The example shows the build target. Its options move into webpack.config.*, so only the configuration names stay on the target.

Before

apps/app1/project.json

{
  "name": "app1",
  "targets": {
    "build": {
      "executor": "@nx/webpack:webpack",
      "options": {
        "webpackConfig": "apps/app1/webpack.config.js",
        "outputPath": "dist/apps/app1",
        "index": "apps/app1/src/index.html",
        "main": "apps/app1/src/main.tsx",
        "tsConfig": "apps/app1/tsconfig.app.json",
        "assets": ["apps/app1/src/favicon.ico", "apps/app1/src/assets"],
        "styles": ["apps/app1/src/styles.scss"],
        "scripts": [],
        "compiler": "babel",
        "baseHref": "/"
      },
      "configurations": {
        "development": {
          "extractLicenses": false,
          "optimization": false,
          "sourceMap": true,
          "vendorChunk": true
        },
        "production": {
          "fileReplacements": [
            {
              "replace": "apps/app1/src/environments/environment.ts",
              "with": "apps/app1/src/environments/environment.prod.ts"
            }
          ],
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": false,
          "namedChunks": false,
          "extractLicenses": true,
          "vendorChunk": false
        }
      },
      "defaultConfiguration": "production"
    }
  }
}

After

apps/app1/project.json

{
  "name": "app1",
  "targets": {
    "build": {
      "configurations": {
        "development": {},
        "production": {}
      },
      "defaultConfiguration": "production"
    }
  }
}

nx.json

{
  "plugins": [
    {
      "plugin": "@nx/webpack/plugin",
      "options": {
        "buildTargetName": "build",
        "previewTargetName": "preview",
        "serveStaticTargetName": "serve-static",
        "serveTargetName": "serve"
      }
    }
  ]
}

update-24-0-0-migrate-compose-plugins

Version: 24.0.0-beta.3

Converts webpack configs that use the removed composePlugins, withNx, withWeb and withReact helpers with @nx/webpack:convert-config-to-webpack-plugin, then hands an AI prompt the projects it could not convert and the .old configs it left behind.

23.0.x

update-23-0-0-remove-nx-tsconfig-paths-webpack-plugin-import

Version: 23.0.0-beta.10

Rewrites imports of NxTsconfigPathsWebpackPlugin from ‘@nx/webpack’ to the sub-path ‘@nx/webpack/tsconfig-paths-plugin’.

Rewrite NxTsconfigPathsWebpackPlugin Imports to the @nx/webpack/tsconfig-paths-plugin Sub-path

The deprecated re-export of NxTsconfigPathsWebpackPlugin from @nx/webpack is removed in v23. The migration rewrites both ES module imports and CJS require() calls to use the @nx/webpack/tsconfig-paths-plugin sub-path. Imports that combine the deprecated symbol with other named imports are split into two declarations so the rest of the original import still resolves from @nx/webpack. Aliases (as Plugin, : Plugin) are preserved.

Sample Code Changes

ES module import.

Before

apps/my-app/webpack.config.ts

import { NxTsconfigPathsWebpackPlugin } from '@nx/webpack';

export default { plugins: [new NxTsconfigPathsWebpackPlugin()] };

After

apps/my-app/webpack.config.ts

import { NxTsconfigPathsWebpackPlugin } from '@nx/webpack/tsconfig-paths-plugin';

export default { plugins: [new NxTsconfigPathsWebpackPlugin()] };

ES module import combined with other named imports.

Before

apps/my-app/webpack.config.ts

import { NxTsconfigPathsWebpackPlugin, NxAppWebpackPlugin } from '@nx/webpack';

After

apps/my-app/webpack.config.ts

import { NxTsconfigPathsWebpackPlugin } from '@nx/webpack/tsconfig-paths-plugin';
import { NxAppWebpackPlugin } from '@nx/webpack';

CJS require().

Before

apps/my-app/webpack.config.js

const { NxTsconfigPathsWebpackPlugin } = require('@nx/webpack');

After

apps/my-app/webpack.config.js

const {
  NxTsconfigPathsWebpackPlugin,
} = require('@nx/webpack/tsconfig-paths-plugin');

rewrite-webpack-internal-subpath-imports

Version: 23.0.0-beta.24

Rewrites @nx/webpack/src/* subpath imports now that the ./src/* subpath is no longer exposed by @nx/webpack’s exports map. Named imports/exports of public symbols are routed to @nx/webpack and the rest to the new @nx/webpack/internal entry; require, dynamic import and jest.mock calls reference the whole module and are routed to @nx/webpack/internal.

update-23-0-0-migrate-create-nodes-v2-import

Version: 23.0.0-beta.24

Rename imports of createNodesV2 from @nx/webpack/plugin to the canonical createNodes export.

Rename createNodesV2 imports to createNodes

@nx/webpack renamed its primary inferred-plugin export from createNodesV2 to createNodes. The createNodesV2 name is preserved as a deprecated alias for now, but new code should use createNodes.

This migration scans every .ts, .tsx, .cts, and .mts file in your workspace and rewrites named imports and re-exports of createNodesV2 from @nx/webpack/plugin to createNodes.

Sample Code Changes

Before

import { createNodesV2 } from '@nx/webpack/plugin';

After

import { createNodes } from '@nx/webpack/plugin';

Aliases are preserved (createNodesV2 as cn becomes createNodes as cn), and if a file already imports both names ({ createNodes, createNodesV2 }) the redundant binding is dropped.

What is not rewritten

Only static import/export named bindings from @nx/webpack/plugin are rewritten. Namespace imports, dynamic import(...), require(...) destructuring, and property access such as plugin.createNodesV2 are left untouched — they keep working through the createNodesV2 runtime alias. Update those by hand if you want to drop the deprecated name everywhere.

23.0.0-package-updates

Version: 23.0.0-beta.24

Packages

The following packages will be updated:

Name	Version	Always add to package.json
webpack	^5.101.3	Added if not installed
webpack-dev-server	^5.2.1	Added if not installed
webpack-cli	^7.0.0	Added if not installed

22.0.x

update-22-0-0-remove-deprecated-options

Version: 22.0.0-beta.0

Remove deprecated deleteOutputPath and sassImplementation options from @nx/webpack:webpack

21.5.x

21.5.0-package-updates

Version: 21.5.0-beta.0

Packages

The following packages will be updated:

Name	Version	Always add to package.json
webpack	5.101.3	Updated only

21.0.x

update-21-0-0-remove-isolated-config

Version: 21.0.0-beta.11

Remove isolatedConfig option for @nx/webpack:webpack

Remove isolatedConfig option

The isolatedConfig option is no longer supported by the @nx/webpack:webpack executor. Previously, setting isolatedConfig: false allowed you to use the executor’s built-in Webpack configuration.

If this option is set in project.json, then it will be removed in favor of an explicit webpackConfig file. The Webpack configuration file matches the previous built-in configuration of the @nx/webpack:webpack executor.

Sample Code Changes

Before

project.json

{
  "targets": {
    "build": {
      "executor": "@nx/webpack:webpack",
      "options": {
        "isolatedConfig": false
      }
    }
  }
}

After

project.json

{
  "targets": {
    "build": {
      "executor": "@nx/webpack:webpack",
      "options": {
        "webpackConfig": "apps/myapp/webpack.config.js"
      }
    }
  }
}