don't comment out SharedMappings in webpack config

angular-architects · Nov 20, 2020 · c19a0aa · c19a0aa
1 parent 12528da
commit c19a0aa
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 10 deletions.
diff --git a/packages/mf/package.json b/packages/mf/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@angular-architects/module-federation",
-  "version": "1.2.0-rc.5",
+  "version": "1.2.0-rc.9",
   "license": "MIT",
   "repository": {
     "type": "GitHub",

diff --git a/packages/mf/src/schematics/mf/schematic.ts b/packages/mf/src/schematics/mf/schematic.ts
@@ -61,7 +61,7 @@ function makeMainAsync(main: string): Rule {
 
     const mainContent = tree.read(main);
     tree.create(bootstrapName, mainContent);
-    tree.overwrite(main, "import('./bootstrap');")
+    tree.overwrite(main, "import('./bootstrap');\n");
 
   }
 }
@@ -107,7 +107,8 @@ export default function config (options: MfSchematicSchema): Rule {
       throw new Error(`Port must be a number!`);
     }
 
-    const webpackConfig = createConfig(projectName, relTsConfigPath, projectRoot, port);
+    const remotes = generateRemoteConfig(workspace, projectName);
+    const webpackConfig = createConfig(projectName, remotes, relTsConfigPath, projectRoot, port);
 
     tree.create(configPath, webpackConfig);
     tree.create(configProdPath, prodConfig);
@@ -138,3 +139,21 @@ export default function config (options: MfSchematicSchema): Rule {
   }
 }
 
+function generateRemoteConfig(workspace: any, projectName: string) {
+  let remotes = '';
+  for (const p in workspace.projects) {
+    const project = workspace.projects[p];
+    const projectType = project.projectType ?? 'application';
+
+    if (p !== projectName && projectType === 'application') {
+      const pPort = project.architect.serve.options.port ?? 4200;
+      remotes += `        //     "${p}": "${p}@http://localhost:${pPort}/remoteEntry.js",\n`;
+    }
+  }
+
+  if (!remotes) {
+    remotes = '        //     "mfe1": "mfe1@http://localhost:3000/remoteEntry.js",\n';
+  }
+  return remotes;
+}
+
diff --git a/packages/mf/src/utils/create-config.ts b/packages/mf/src/utils/create-config.ts
@@ -1,11 +1,13 @@
-export function createConfig(projectName: string, tsConfigName: string, root: string, port: number): string {
+export function createConfig(projectName: string, remotes: string, tsConfigName: string, root: string, port: number): string {
 
     return `const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
 const mf = require("@angular-architects/module-federation/webpack");
 const path = require("path");
 
 const sharedMappings = new mf.SharedMappings();
-sharedMappings.register(path.join(__dirname, '${tsConfigName}'));
+sharedMappings.register(
+  path.join(__dirname, '${tsConfigName}'),
+  [/* mapped paths to share */]);
 
 module.exports = {
   output: {
@@ -27,21 +29,19 @@ module.exports = {
         
         // For hosts (please adjust)
         // remotes: {
-        //     'mfe1': "mfe1@http://localhost:3000/remoteEntry.js" 
+${remotes}
         // },
 
         shared: {
           "@angular/core": { singleton: true, strictVersion: true }, 
           "@angular/common": { singleton: true, strictVersion: true }, 
           "@angular/router": { singleton: true, strictVersion: true },
 
-          // Uncomment for sharing lib of an Angular CLI or Nx workspace
-          // ...sharedMappings.getDescriptors()
+          ...sharedMappings.getDescriptors()
         }
         
     }),
-    // Uncomment for sharing lib of an Angular CLI or Nx workspace
-    // sharedMappings.getPlugin(),
+    sharedMappings.getPlugin(),
   ],
 };
 `;

diff --git a/packages/mf/webpack.ts b/packages/mf/webpack.ts
@@ -0,0 +1 @@
+export * from './src/webpack';