diff --git a/packages/angular/src/generators/remote/remote.ts b/packages/angular/src/generators/remote/remote.ts
index 5c5b42cdd6..7ded7fd742 100644
--- a/packages/angular/src/generators/remote/remote.ts
+++ b/packages/angular/src/generators/remote/remote.ts
@@ -1,9 +1,7 @@
import {
formatFiles,
getProjects,
- joinPathFragments,
readProjectConfiguration,
- readWorkspaceConfiguration,
Tree,
} from '@nrwl/devkit';
import type { Schema } from './schema';
@@ -62,8 +60,6 @@ export async function remote(tree: Tree, options: Schema) {
standalone: options.standalone,
});
- removeDeadCode(tree, options);
-
if (!options.skipFormat) {
await formatFiles(tree);
}
@@ -71,86 +67,4 @@ export async function remote(tree: Tree, options: Schema) {
return installTask;
}
-function removeDeadCode(tree: Tree, options: Schema) {
- const projectName = normalizeProjectName(options.name, options.directory);
- const project = readProjectConfiguration(tree, projectName);
-
- ['css', 'less', 'scss', 'sass'].forEach((style) => {
- const pathToComponentStyle = joinPathFragments(
- project.sourceRoot,
- `app/app.component.${style}`
- );
- if (tree.exists(pathToComponentStyle)) {
- tree.delete(pathToComponentStyle);
- }
- });
-
- tree.rename(
- joinPathFragments(project.sourceRoot, 'app/nx-welcome.component.ts'),
- joinPathFragments(
- project.sourceRoot,
- 'app/remote-entry/nx-welcome.component.ts'
- )
- );
- tree.delete(
- joinPathFragments(project.sourceRoot, 'app/app.component.spec.ts')
- );
- tree.delete(joinPathFragments(project.sourceRoot, 'app/app.component.html'));
-
- const pathToAppComponent = joinPathFragments(
- project.sourceRoot,
- 'app/app.component.ts'
- );
- if (!options.standalone) {
- const component =
- tree
- .read(pathToAppComponent, 'utf-8')
- .split(options.inlineTemplate ? 'template' : 'templateUrl')[0] +
- `template: ''
-
-})
-export class AppComponent {}`;
-
- tree.write(pathToAppComponent, component);
-
- tree.write(
- joinPathFragments(project.sourceRoot, 'app/app.module.ts'),
- `import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { RouterModule } from '@angular/router';
-import { AppComponent } from './app.component';
-
-@NgModule({
- declarations: [AppComponent],
- imports: [
- BrowserModule,
- RouterModule.forRoot([{
- path: '',
- loadChildren: () => import('./remote-entry/entry.module').then(m => m.RemoteEntryModule)
- }], { initialNavigation: 'enabledBlocking' }),
- ],
- providers: [],
- bootstrap: [AppComponent],
-})
-export class AppModule {}`
- );
- } else {
- tree.delete(pathToAppComponent);
-
- const prefix = options.prefix ?? readWorkspaceConfiguration(tree).npmScope;
- const remoteEntrySelector = `${prefix}-${projectName}-entry`;
-
- const pathToIndexHtml = project.targets.build.options.index;
- const indexContents = tree.read(pathToIndexHtml, 'utf-8');
-
- const rootSelectorRegex = new RegExp(`${prefix}-root`, 'ig');
- const newIndexContents = indexContents.replace(
- rootSelectorRegex,
- remoteEntrySelector
- );
-
- tree.write(pathToIndexHtml, newIndexContents);
- }
-}
-
export default remote;
diff --git a/packages/angular/src/generators/setup-mf/lib/index.ts b/packages/angular/src/generators/setup-mf/lib/index.ts
index 8eaeca0fa6..efcb4b37a3 100644
--- a/packages/angular/src/generators/setup-mf/lib/index.ts
+++ b/packages/angular/src/generators/setup-mf/lib/index.ts
@@ -9,3 +9,4 @@ export * from './set-tsconfig-target';
export * from './setup-host-if-dynamic';
export * from './setup-serve-target';
export * from './update-host-app-routes';
+export * from './remove-dead-code-from-remote';
diff --git a/packages/angular/src/generators/setup-mf/lib/remove-dead-code-from-remote.ts b/packages/angular/src/generators/setup-mf/lib/remove-dead-code-from-remote.ts
new file mode 100644
index 0000000000..9292846f04
--- /dev/null
+++ b/packages/angular/src/generators/setup-mf/lib/remove-dead-code-from-remote.ts
@@ -0,0 +1,92 @@
+import { Tree } from 'nx/src/generators/tree';
+import { Schema } from '../schema';
+import {
+ readProjectConfiguration,
+ readWorkspaceConfiguration,
+} from 'nx/src/generators/utils/project-configuration';
+import { joinPathFragments } from 'nx/src/utils/path';
+
+export function removeDeadCodeFromRemote(tree: Tree, options: Schema) {
+ const projectName = options.appName;
+ const project = readProjectConfiguration(tree, projectName);
+
+ ['css', 'less', 'scss', 'sass'].forEach((style) => {
+ const pathToComponentStyle = joinPathFragments(
+ project.sourceRoot,
+ `app/app.component.${style}`
+ );
+ if (tree.exists(pathToComponentStyle)) {
+ tree.delete(pathToComponentStyle);
+ }
+ });
+
+ tree.rename(
+ joinPathFragments(project.sourceRoot, 'app/nx-welcome.component.ts'),
+ joinPathFragments(
+ project.sourceRoot,
+ 'app/remote-entry/nx-welcome.component.ts'
+ )
+ );
+ tree.delete(
+ joinPathFragments(project.sourceRoot, 'app/app.component.spec.ts')
+ );
+ tree.delete(joinPathFragments(project.sourceRoot, 'app/app.component.html'));
+
+ const pathToAppComponent = joinPathFragments(
+ project.sourceRoot,
+ 'app/app.component.ts'
+ );
+ if (!options.standalone) {
+ const componentContents = tree.read(pathToAppComponent, 'utf-8');
+ const isInlineTemplate = !componentContents.includes('templateUrl');
+
+ const component =
+ componentContents.split(
+ isInlineTemplate ? 'template' : 'templateUrl'
+ )[0] +
+ `template: ''
+
+})
+export class AppComponent {}`;
+
+ tree.write(pathToAppComponent, component);
+
+ tree.write(
+ joinPathFragments(project.sourceRoot, 'app/app.module.ts'),
+ `import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { RouterModule } from '@angular/router';
+import { AppComponent } from './app.component';
+
+@NgModule({
+ declarations: [AppComponent],
+ imports: [
+ BrowserModule,
+ RouterModule.forRoot([{
+ path: '',
+ loadChildren: () => import('./remote-entry/entry.module').then(m => m.RemoteEntryModule)
+ }], { initialNavigation: 'enabledBlocking' }),
+ ],
+ providers: [],
+ bootstrap: [AppComponent],
+})
+export class AppModule {}`
+ );
+ } else {
+ tree.delete(pathToAppComponent);
+
+ const prefix = options.prefix ?? readWorkspaceConfiguration(tree).npmScope;
+ const remoteEntrySelector = `${prefix}-${projectName}-entry`;
+
+ const pathToIndexHtml = project.targets.build.options.index;
+ const indexContents = tree.read(pathToIndexHtml, 'utf-8');
+
+ const rootSelectorRegex = new RegExp(`${prefix}-root`, 'ig');
+ const newIndexContents = indexContents.replace(
+ rootSelectorRegex,
+ remoteEntrySelector
+ );
+
+ tree.write(pathToIndexHtml, newIndexContents);
+ }
+}
diff --git a/packages/angular/src/generators/setup-mf/setup-mf.ts b/packages/angular/src/generators/setup-mf/setup-mf.ts
index cdcd24dbcb..f0b6158a56 100644
--- a/packages/angular/src/generators/setup-mf/setup-mf.ts
+++ b/packages/angular/src/generators/setup-mf/setup-mf.ts
@@ -10,6 +10,7 @@ import {
fixBootstrap,
generateWebpackConfig,
getRemotesWithPorts,
+ removeDeadCodeFromRemote,
setupHostIfDynamic,
setupServeTarget,
updateHostAppRoutes,
@@ -29,6 +30,7 @@ export async function setupMf(tree: Tree, options: Schema) {
if (options.mfType === 'remote') {
addRemoteToHost(tree, options);
addRemoteEntry(tree, options, projectConfig.root);
+ removeDeadCodeFromRemote(tree, options);
}
const remotesWithPorts = getRemotesWithPorts(tree, options);