miel.truyen/nx
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

feat(angular): support esbuild-based executors/builders in @nx/angular:dev-server (#20311)

Browse Source
This commit is contained in:
Leosvel Pérez Espinosa 2023-11-23 15:48:02 +01:00 committed by GitHub
parent 0f6c1168db
commit 40f8c40df2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
24 changed files with 327 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/generated/manifests/menus.json
View File

@ -6553,9 +6553,9 @@
"disableCollapsible": false
},
{
"id": "webpack-dev-server",
"path": "/nx-api/angular/executors/webpack-dev-server",
"name": "webpack-dev-server",
"id": "dev-server",
"path": "/nx-api/angular/executors/dev-server",
"name": "dev-server",
"children": [],
"isExternal": false,
"disableCollapsible": false

12
docs/generated/manifests/nx-api.json
View File

@ -76,13 +76,13 @@
"path": "/nx-api/angular/executors/webpack-browser",
"type": "executor"
},
"/nx-api/angular/executors/webpack-dev-server": {
"description": "The `webpack-dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"file": "generated/packages/angular/executors/webpack-dev-server.json",
"/nx-api/angular/executors/dev-server": {
"description": "The `dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"file": "generated/packages/angular/executors/dev-server.json",
"hidden": false,
"name": "webpack-dev-server",
"originalFilePath": "/packages/angular/src/builders/webpack-dev-server/schema.json",
"path": "/nx-api/angular/executors/webpack-dev-server",
"name": "dev-server",
"originalFilePath": "/packages/angular/src/builders/dev-server/schema.json",
"path": "/nx-api/angular/executors/dev-server",
"type": "executor"
},
"/nx-api/angular/executors/webpack-server": {

10
docs/generated/packages-metadata.json
View File

@ -72,12 +72,12 @@
"type": "executor"
},
{
"description": "The `webpack-dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"file": "generated/packages/angular/executors/webpack-dev-server.json",
"description": "The `dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"file": "generated/packages/angular/executors/dev-server.json",
"hidden": false,
"name": "webpack-dev-server",
"originalFilePath": "/packages/angular/src/builders/webpack-dev-server/schema.json",
"path": "angular/executors/webpack-dev-server",
"name": "dev-server",
"originalFilePath": "/packages/angular/src/builders/dev-server/schema.json",
"path": "angular/executors/dev-server",
"type": "executor"
},
{

12
docs/generated/packages/angular/executors/webpack-dev-server.json → docs/generated/packages/angular/executors/dev-server.json
View File

@ -1,13 +1,13 @@
{
"name": "webpack-dev-server",
"implementation": "/packages/angular/src/builders/webpack-dev-server/webpack-dev-server.impl.ts",
"name": "dev-server",
"implementation": "/packages/angular/src/builders/dev-server/dev-server.impl.ts",
"schema": {
"version": 2,
"outputCapture": "direct-nodejs",
"$schema": "http://json-schema.org/draft-07/schema",
"title": "Schema for Webpack Dev Server",
"description": "The webpack-dev-server executor is very similar to the standard dev server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"examplesFile": "##### Seving an application with a custom webpack configuration\n\nThis executor should be used along with `@nx/angular:webpack-browser` to serve an application using a custom webpack configuration.\n\nYour `project.json` file should contain a `build` and `serve` target that matches the following:\n\n```json\n\"build\": {\n \"executor\": \"@nx/angular:webpack-browser\",\n \"options\": {\n ...\n \"customWebpackConfig\": {\n \"path\": \"apps/appName/webpack.config.js\"\n }\n }\n},\n\"serve\": {\n \"executor\": \"@nx/angular:webpack-dev-server\",\n \"configurations\": {\n \"production\": {\n \"buildTarget\": \"appName:build:production\"\n },\n \"development\": {\n \"buildTarget\": \"appName:build:development\"\n }\n },\n \"defaultConfiguration\": \"development\",\n}\n```\n",
"description": "The dev-server executor is very similar to the standard dev server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"examplesFile": "##### Seving an application with a custom webpack configuration\n\nThis executor should be used along with `@nx/angular:webpack-browser` to serve an application using a custom webpack configuration.\n\nYour `project.json` file should contain a `build` and `serve` target that matches the following:\n\n```json\n\"build\": {\n \"executor\": \"@nx/angular:webpack-browser\",\n \"options\": {\n ...\n \"customWebpackConfig\": {\n \"path\": \"apps/appName/webpack.config.js\"\n }\n }\n},\n\"serve\": {\n \"executor\": \"@nx/angular:dev-server\",\n \"configurations\": {\n \"production\": {\n \"buildTarget\": \"appName:build:production\"\n },\n \"development\": {\n \"buildTarget\": \"appName:build:development\"\n }\n },\n \"defaultConfiguration\": \"development\",\n}\n```\n",
"type": "object",
"presets": [
{ "name": "Using a Different Port", "keys": ["buildTarget", "port"] }
@ -117,9 +117,9 @@
{ "required": ["browserTarget"] }
]
},
"description": "The `webpack-dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"description": "The `dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"aliases": [],
"hidden": false,
"path": "/packages/angular/src/builders/webpack-dev-server/schema.json",
"path": "/packages/angular/src/builders/dev-server/schema.json",
"type": "executor"
}

2
docs/generated/packages/angular/executors/webpack-server.json
View File

@ -6,7 +6,7 @@
"outputCapture": "direct-nodejs",
"$schema": "http://json-schema.org/draft-07/schema",
"title": "Schema for Webpack Server",
"description": "The webpack-dev-server executor is very similar to the standard server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration and NgUniversal for SSR.",
"description": "The webpack-server executor is very similar to the standard server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration and NgUniversal for SSR.",
"type": "object",
"properties": {
"assets": {

2
docs/packages.json
View File

@ -10,7 +10,7 @@
"ng-packagr-lite",
"package",
"webpack-browser",
"webpack-dev-server",
"dev-server",
"webpack-server",
"module-federation-dev-server",
"module-federation-dev-ssr"

2
docs/shared/reference/sitemap.md
View File

@ -324,7 +324,7 @@
- [package](/nx-api/angular/executors/package)
- [browser-esbuild](/nx-api/angular/executors/browser-esbuild)
- [webpack-browser](/nx-api/angular/executors/webpack-browser)
- [webpack-dev-server](/nx-api/angular/executors/webpack-dev-server)
- [dev-server](/nx-api/angular/executors/dev-server)
- [webpack-server](/nx-api/angular/executors/webpack-server)
- [module-federation-dev-server](/nx-api/angular/executors/module-federation-dev-server)
- [module-federation-dev-ssr](/nx-api/angular/executors/module-federation-dev-ssr)

7
nx-dev/nx-dev/redirect-rules.js
View File

@ -58,9 +58,12 @@ const schemaUrls = {
'/angular/ng-packagr-lite': '/packages/angular/executors/ng-packagr-lite',
'/angular/package': '/packages/angular/executors/package',
'/angular/webpack-browser': '/packages/angular/executors/webpack-browser',
'/angular/webpack-server': '/packages/angular/executors/webpack-dev-server',
'/angular/webpack-server': '/packages/angular/executors/dev-server',
'/packages/angular/executors/webpack-server':
'/packages/angular/executors/webpack-dev-server',
'/packages/angular/executors/dev-server',
'/angular/webpack-dev-server': '/packages/angular/executors/dev-server',
'/packages/angular/executors/webpack-dev-server':
'/packages/angular/executors/dev-server',
'/react/application': '/packages/react/generators/application',
'/react/component': '/packages/react/generators/component',
'/react/component-cypress-spec':

8
packages-legacy/angular/executors.json
View File

@ -37,10 +37,10 @@
"schema": "@nx/angular/src/builders/webpack-browser/schema.json",
"description": "The `webpack-browser` executor is very similar to the standard `browser` builder provided by the Angular Devkit. It allows you to build your Angular application to a build artifact that can be hosted online. There are some key differences: \n- Supports Custom Webpack Configurations \n- Supports Incremental Building"
},
"webpack-dev-server": {
"implementation": "@nx/angular/src/builders/webpack-dev-server/webpack-dev-server.impl",
"schema": "@nx/angular/src/builders/webpack-dev-server/schema.json",
"description": "The `webpack-dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration."
"dev-server": {
"implementation": "@nx/angular/src/builders/dev-server/dev-server.impl",
"schema": "@nx/angular/src/builders/dev-server/schema.json",
"description": "The `dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration."
},
"webpack-server": {
"implementation": "@nx/angular/src/builders/webpack-server/webpack-server.impl",

2
packages/angular/docs/webpack-dev-server-examples.md → packages/angular/docs/dev-server-examples.md
View File

@ -15,7 +15,7 @@ Your `project.json` file should contain a `build` and `serve` target that matche
}
},
"serve": {
"executor": "@nx/angular:webpack-dev-server",
"executor": "@nx/angular:dev-server",
"configurations": {
"production": {
"buildTarget": "appName:build:production"

8
packages/angular/executors.json
View File

@ -27,10 +27,10 @@
"schema": "./src/builders/webpack-browser/schema.json",
"description": "The `webpack-browser` executor is very similar to the standard `browser` builder provided by the Angular Devkit. It allows you to build your Angular application to a build artifact that can be hosted online. There are some key differences: \n- Supports Custom Webpack Configurations \n- Supports Incremental Building"
},
"webpack-dev-server": {
"implementation": "./src/builders/webpack-dev-server/webpack-dev-server.impl",
"schema": "./src/builders/webpack-dev-server/schema.json",
"description": "The `webpack-dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration."
"dev-server": {
"implementation": "./src/builders/dev-server/dev-server.impl",
"schema": "./src/builders/dev-server/schema.json",
"description": "The `dev-server` executor is very similar to the standard `dev-server` builder provided by the Angular Devkit. It is usually used in tandem with `@nrwl/angular:webpack-browser` when your Angular application uses a custom webpack configuration."
},
"webpack-server": {
"implementation": "./src/builders/webpack-server/webpack-server.impl",

12
packages/angular/executors.ts
View File

@ -1,9 +1,19 @@
export * from './src/builders/module-federation-dev-server/module-federation-dev-server.impl';
export * from './src/builders/module-federation-dev-ssr/module-federation-dev-ssr.impl';
export * from './src/builders/webpack-browser/webpack-browser.impl';
export * from './src/builders/webpack-dev-server/webpack-dev-server.impl';
export * from './src/builders/webpack-server/webpack-server.impl';
export * from './src/executors/delegate-build/delegate-build.impl';
export * from './src/executors/ng-packagr-lite/ng-packagr-lite.impl';
export * from './src/executors/package/package.impl';
export * from './src/executors/browser-esbuild/browser-esbuild.impl';
import { executeDevServerBuilder } from './src/builders/dev-server/dev-server.impl';
export {
// TODO(v18): remove this alias
/**
* @deprecated Use executeDevServerBuilder instead. It will be removed in Nx v18.
*/
executeDevServerBuilder as executeWebpackDevServerBuilder,
executeDevServerBuilder,
};

6
packages/angular/migrations.json
View File

@ -323,6 +323,12 @@
},
"description": "Replace the deep imports from 'zone.js/dist/zone' and 'zone.js/dist/zone-testing' with 'zone.js' and 'zone.js/testing'.",
"factory": "./src/migrations/update-17-1-0/update-zone-js-deep-import"
},
"rename-webpack-dev-server-executor": {
"cli": "nx",
"version": "17.2.0-beta.2",
"description": "Rename '@nx/angular:webpack-dev-server' executor to '@nx/angular:dev-server'",
"factory": "./src/migrations/update-17-2-0/rename-webpack-dev-server"
}
},
"packageJsonUpdates": {

62
packages/angular/src/builders/webpack-dev-server/webpack-dev-server.impl.ts → packages/angular/src/builders/dev-server/dev-server.impl.ts
View File

@ -1,7 +1,10 @@
import type { BuilderContext } from '@angular-devkit/architect';
import type { DevServerBuilderOptions } from '@angular-devkit/build-angular';
import {
joinPathFragments,
parseTargetString,
readCachedProjectGraph,
type TargetConfiguration,
} from '@nx/devkit';
import { getRootTsConfigPath } from '@nx/js';
import type { DependentBuildableProjectNode } from '@nx/js/src/utils/buildable-libs-utils';
@ -11,6 +14,7 @@ import { isNpmProject } from 'nx/src/project-graph/operators';
import { readCachedProjectConfiguration } from 'nx/src/project-graph/project-graph';
import { from } from 'rxjs';
import { switchMap } from 'rxjs/operators';
import { gte } from 'semver';
import { getInstalledAngularVersionInfo } from '../../executors/utilities/angular-version-utils';
import { createTmpTsConfigForBuildableLibs } from '../utilities/buildable-libs';
import {
@ -31,7 +35,7 @@ type BuildTargetOptions = {
indexFileTransformer?: string;
};
export function executeWebpackDevServerBuilder(
export function executeDevServerBuilder(
rawOptions: Schema,
context: import('@angular-devkit/architect').BuilderContext
) {
@ -123,12 +127,22 @@ export function executeWebpackDevServerBuilder(
buildTargetOptions.tsConfig = tsConfigPath;
}
const delegateBuilderOptions = getDelegateBuilderOptions(options);
const delegateBuilderOptions = getDelegateBuilderOptions(
options,
buildTarget,
context
);
const isUsingWebpackBuilder = ![
'@angular-devkit/build-angular:application',
'@angular-devkit/build-angular:browser-esbuild',
'@nx/angular:browser-esbuild',
].includes(buildTarget.executor);
return from(import('@angular-devkit/build-angular')).pipe(
switchMap(({ executeDevServerBuilder }) =>
executeDevServerBuilder(delegateBuilderOptions, context, {
webpackConfiguration: async (baseWebpackConfig) => {
webpackConfiguration: isUsingWebpackBuilder
? async (baseWebpackConfig) => {
if (!buildLibsFromSource) {
const workspaceDependencies = dependencies
.filter((dep) => !isNpmProject(dep.node))
@ -159,7 +173,8 @@ export function executeWebpackDevServerBuilder(
buildTargetOptions,
context.target
);
},
}
: undefined,
...(pathToIndexFileTransformer
? {
@ -176,13 +191,42 @@ export function executeWebpackDevServerBuilder(
}
export default require('@angular-devkit/architect').createBuilder(
executeWebpackDevServerBuilder
executeDevServerBuilder
) as any;
function getDelegateBuilderOptions(options: NormalizedSchema) {
const delegatedBuilderOptions = { ...options };
const { major } = getInstalledAngularVersionInfo();
if (major <= 17) {
function getDelegateBuilderOptions(
options: NormalizedSchema,
buildTarget: TargetConfiguration,
context: BuilderContext
) {
const delegatedBuilderOptions: DevServerBuilderOptions = { ...options };
const { major: angularMajorVersion, version: angularVersion } =
getInstalledAngularVersionInfo();
// this option was introduced in angular 16.1.0
// https://github.com/angular/angular-cli/commit/3ede1a2cac5005f4dfbd2a62ef528a34c3793b78
if (
gte(angularVersion, '16.1.0') &&
buildTarget.executor === '@nx/angular:browser-esbuild'
) {
delegatedBuilderOptions.forceEsbuild = true;
const originalLoggerWarn = context.logger.warn.bind(context.logger);
context.logger.warn = (...args) => {
// we silence the warning about forcing esbuild from third-party builders
if (
args[0].includes(
'Warning: Forcing the use of the esbuild-based build system with third-party builders may cause unexpected behavior and/or build failures.'
)
) {
return;
}
originalLoggerWarn(...args);
};
}
if (angularMajorVersion <= 17) {
(
delegatedBuilderOptions as unknown as SchemaWithBrowserTarget
).browserTarget = delegatedBuilderOptions.buildTarget;

0
packages/angular/src/builders/webpack-dev-server/lib/index.ts → packages/angular/src/builders/dev-server/lib/index.ts
View File

0
packages/angular/src/builders/webpack-dev-server/lib/normalize-options.ts → packages/angular/src/builders/dev-server/lib/normalize-options.ts
View File

0
packages/angular/src/builders/webpack-dev-server/schema.d.ts → packages/angular/src/builders/dev-server/schema.d.ts vendored
View File

4
packages/angular/src/builders/webpack-dev-server/schema.json → packages/angular/src/builders/dev-server/schema.json
View File

@ -3,8 +3,8 @@
"outputCapture": "direct-nodejs",
"$schema": "http://json-schema.org/draft-07/schema",
"title": "Schema for Webpack Dev Server",
"description": "The webpack-dev-server executor is very similar to the standard dev server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"examplesFile": "../../../docs/webpack-dev-server-examples.md",
"description": "The dev-server executor is very similar to the standard dev server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration.",
"examplesFile": "../../../docs/dev-server-examples.md",
"type": "object",
"presets": [
{

6
packages/angular/src/builders/module-federation-dev-server/module-federation-dev-server.impl.ts
View File

@ -13,7 +13,7 @@ import {
workspaceRoot,
} from '@nx/devkit';
import { scheduleTarget } from 'nx/src/adapter/ngcli-adapter';
import { executeWebpackDevServerBuilder } from '../webpack-dev-server/webpack-dev-server.impl';
import { executeDevServerBuilder } from '../dev-server/dev-server.impl';
import { readProjectsConfigurationFromProjectGraph } from 'nx/src/project-graph/project-graph';
import { getExecutorInformation } from 'nx/src/command-line/run/executor-utils';
import { validateDevRemotes } from '../utilities/module-federation';
@ -241,7 +241,7 @@ function startDevRemotes(
export function executeModuleFederationDevServerBuilder(
schema: Schema,
context: import('@angular-devkit/architect').BuilderContext
): ReturnType<typeof executeWebpackDevServerBuilder | any> {
): ReturnType<typeof executeDevServerBuilder | any> {
// Force Node to resolve to look for the nx binary that is inside node_modules
const nxBin = require.resolve('nx/bin/nx');
const options = normalizeOptions(schema);
@ -285,7 +285,7 @@ export function executeModuleFederationDevServerBuilder(
)
)
);
const webpackDevServer = executeWebpackDevServerBuilder(options, context);
const webpackDevServer = executeDevServerBuilder(options, context);
const currExecutor = options.static ? staticFileServer : webpackDevServer;

2
packages/angular/src/builders/webpack-server/schema.json
View File

@ -3,7 +3,7 @@
"outputCapture": "direct-nodejs",
"$schema": "http://json-schema.org/draft-07/schema",
"title": "Schema for Webpack Server",
"description": "The webpack-dev-server executor is very similar to the standard server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration and NgUniversal for SSR.",
"description": "The webpack-server executor is very similar to the standard server builder provided by the Angular Devkit. It is usually used in tandem with `@nx/angular:webpack-browser` when your Angular application uses a custom webpack configuration and NgUniversal for SSR.",
"type": "object",
"properties": {
"assets": {

2
packages/angular/src/generators/setup-mf/lib/setup-serve-target.ts
View File

@ -13,7 +13,7 @@ export function setupServeTarget(host: Tree, options: Schema) {
executor:
options.mfType === 'host'
? '@nx/angular:module-federation-dev-server'
: '@nx/angular:webpack-dev-server',
: '@nx/angular:dev-server',
options: {
...appConfig.targets['serve'].options,
port: options.port ?? undefined,

4
packages/angular/src/generators/setup-mf/setup-mf.spec.ts
View File

@ -151,7 +151,7 @@ describe('Init MF', () => {
expect(serve.executor).toEqual(
type === 'host'
? '@nx/angular:module-federation-dev-server'
: '@nx/angular:webpack-dev-server'
: '@nx/angular:dev-server'
);
expect(build.executor).toEqual('@nx/angular:webpack-browser');
expect(build.options.customWebpackConfig.path).toEqual(
@ -180,7 +180,7 @@ describe('Init MF', () => {
expect(serve.executor).toEqual(
type === 'host'
? '@nx/angular:module-federation-dev-server'
: '@nx/angular:webpack-dev-server'
: '@nx/angular:dev-server'
);
expect(build.executor).toEqual('@nx/angular:webpack-browser');
expect(build.options.customWebpackConfig.path).toEqual(

128
packages/angular/src/migrations/update-17-2-0/rename-webpack-dev-server.spec.ts Normal file
View File

@ -0,0 +1,128 @@
import {
addProjectConfiguration,
readJson,
readProjectConfiguration,
updateJson,
type NxJsonConfiguration,
type Tree,
} from '@nx/devkit';
import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
import migration from './rename-webpack-dev-server';
describe('rename-webpack-dev-server migration', () => {
let tree: Tree;
beforeEach(() => {
tree = createTreeWithEmptyWorkspace();
});
it('should replace @nx/angular:webpack-dev-server with @nx/angular:dev-server', async () => {
addProjectConfiguration(tree, 'app1', {
root: 'apps/app1',
projectType: 'application',
targets: {
serve: {
executor: '@nx/angular:webpack-dev-server',
options: {},
configurations: {},
},
},
});
await migration(tree);
const project = readProjectConfiguration(tree, 'app1');
expect(project.targets.serve.executor).toBe('@nx/angular:dev-server');
});
it('should replace @nrwl/angular:webpack-dev-server with @nx/angular:dev-server', async () => {
addProjectConfiguration(tree, 'app1', {
root: 'apps/app1',
projectType: 'application',
targets: {
serve: {
executor: '@nrwl/angular:webpack-dev-server',
options: {},
configurations: {},
},
},
});
await migration(tree);
const project = readProjectConfiguration(tree, 'app1');
expect(project.targets.serve.executor).toBe('@nx/angular:dev-server');
});
it('should replace @nx/angular:webpack-dev-server with @nx/angular:dev-server from nx.json targetDefaults keys', async () => {
updateJson<NxJsonConfiguration>(tree, 'nx.json', (json) => {
json.targetDefaults ??= {};
json.targetDefaults['@nx/angular:webpack-dev-server'] = {
options: {},
configurations: {},
};
return json;
});
await migration(tree);
const nxJson = readJson<NxJsonConfiguration>(tree, 'nx.json');
expect(
nxJson.targetDefaults['@nx/angular:webpack-dev-server']
).toBeUndefined();
expect(nxJson.targetDefaults['@nx/angular:dev-server']).toBeDefined();
});
it('should replace @nrwl/angular:webpack-dev-server with @nx/angular:dev-server from nx.json targetDefaults keys', async () => {
updateJson<NxJsonConfiguration>(tree, 'nx.json', (json) => {
json.targetDefaults ??= {};
json.targetDefaults['@nrwl/angular:webpack-dev-server'] = {
options: {},
configurations: {},
};
return json;
});
await migration(tree);
const nxJson = readJson<NxJsonConfiguration>(tree, 'nx.json');
expect(
nxJson.targetDefaults['@nrwl/angular:webpack-dev-server']
).toBeUndefined();
expect(nxJson.targetDefaults['@nx/angular:dev-server']).toBeDefined();
});
it('should replace @nx/angular:webpack-dev-server with @nx/angular:dev-server from nx.json targetDefaults value executors', async () => {
updateJson<NxJsonConfiguration>(tree, 'nx.json', (json) => {
json.targetDefaults ??= {};
json.targetDefaults.serve = {
executor: '@nx/angular:webpack-dev-server',
options: {},
configurations: {},
};
return json;
});
await migration(tree);
const nxJson = readJson<NxJsonConfiguration>(tree, 'nx.json');
expect(nxJson.targetDefaults.serve.executor).toBe('@nx/angular:dev-server');
});
it('should replace @nrwl/angular:webpack-dev-server with @nx/angular:dev-server from nx.json targetDefaults value executors', async () => {
updateJson<NxJsonConfiguration>(tree, 'nx.json', (json) => {
json.targetDefaults ??= {};
json.targetDefaults.serve = {
executor: '@nrwl/angular:webpack-dev-server',
options: {},
configurations: {},
};
return json;
});
await migration(tree);
const nxJson = readJson<NxJsonConfiguration>(tree, 'nx.json');
expect(nxJson.targetDefaults.serve.executor).toBe('@nx/angular:dev-server');
});
});

55
packages/angular/src/migrations/update-17-2-0/rename-webpack-dev-server.ts Normal file
View File

@ -0,0 +1,55 @@
import {
formatFiles,
getProjects,
readNxJson,
updateNxJson,
updateProjectConfiguration,
type Tree,
} from '@nx/devkit';
export default async function (tree: Tree) {
const projects = getProjects(tree);
for (const [, project] of projects) {
if (project.projectType !== 'application') {
continue;
}
for (const target of Object.values(project.targets ?? {})) {
if (
target.executor === '@nx/angular:webpack-dev-server' ||
target.executor === '@nrwl/angular:webpack-dev-server'
) {
target.executor = '@nx/angular:dev-server';
}
}
updateProjectConfiguration(tree, project.name, project);
}
// update options from nx.json target defaults
const nxJson = readNxJson(tree);
if (!nxJson.targetDefaults) {
return;
}
for (const [targetOrExecutor, targetConfig] of Object.entries(
nxJson.targetDefaults
)) {
if (targetOrExecutor === '@nx/angular:webpack-dev-server') {
nxJson.targetDefaults['@nx/angular:dev-server'] = targetConfig;
delete nxJson.targetDefaults['@nx/angular:webpack-dev-server'];
} else if (targetOrExecutor === '@nrwl/angular:webpack-dev-server') {
nxJson.targetDefaults['@nx/angular:dev-server'] = targetConfig;
delete nxJson.targetDefaults['@nrwl/angular:webpack-dev-server'];
} else if (
targetConfig.executor === '@nx/angular:webpack-dev-server' ||
targetConfig.executor === '@nrwl/angular:webpack-dev-server'
) {
targetConfig.executor = '@nx/angular:dev-server';
}
}
updateNxJson(tree, nxJson);
await formatFiles(tree);
}