Softarc Native Federation

https://www.npmjs.com/package/@softarc/native-federation
Admin
Softarc Native Federation is a browser-native implementation of Module Federation for building Micro...
Tokens:17,264
Snippets:156
Trust Score:9.6
Update:7 months ago
Show doc for...
Tokens:
Raw
### Configure Host with Shared Dependencies

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependencies

Shows how to use withNativeFederation and shareAll to configure host applications. It includes examples for basic sharing and advanced configurations with specific package overrides.

```JavaScript
const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'host',
  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: 'auto',
      includeSecondaries: false,
    }),
  },
});
```

```JavaScript
const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'host',
  shared: {
    ...shareAll(
      { singleton: true, strictVersion: true, requiredVersion: 'auto' },
      {
        overrides: {
          'package-a/themes/xyz': { singleton: true, build: 'package' },
          'package-b': { singleton: false, build: 'package' },
        },
      }
    ),
  },
});
```

--------------------------------

### Install Native Federation packages

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=versions

Commands to install the core Native Federation library and the esbuild adapter for build-tool integration.

```bash
npm i @softarc/native-federation
```

```bash
npm i @softarc/native-federation-esbuild
```

--------------------------------

### Configure Host Federation Settings

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=readme

Shows how to use withNativeFederation and shareAll to define shared dependencies for a host application. Includes examples for basic sharing and advanced overrides for specific packages.

```javascript
const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'host',
  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: 'auto',
    }),
  },
});
```

```javascript
const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'host',
  shared: {
    ...shareAll(
      { singleton: true, strictVersion: true, requiredVersion: 'auto' },
      {
        overrides: {
          'package-a/themes/xyz': { singleton: true, build: 'package' },
          'package-b': { singleton: false, build: 'package' },
        },
      }
    ),
  },
});
```

--------------------------------

### Skip Sharing Specific Dependencies

Source: https://www.npmjs.com/package/@softarc/native-federation?activeTab=versions

This example shows how to opt-out of sharing specific dependencies defined in `package.json` using the `skip` array within the `withNativeFederation` configuration. This prevents certain libraries, like 'my-lib', from being shared across remotes and hosts.

```javascript
module.exports = withNativeFederation({
  [...] 

  // Don't share my-lib
  skip: [
    'my-lib'
  ]

  [...] 
})
```

--------------------------------

### Enable Glob Exports Resolution with resolveGlob

Source: https://www.npmjs.com/package/@softarc/native-federation?activeTab=versions

This example shows how to enable `globResolve` within `includeSecondaries` to resolve Glob exports. It also illustrates how to use the `skip` wildcard to exclude specific parts of a glob export, like "package-a/themes/xyz/*". This feature should be used with `ignoreUnusedDeps`.

```javascript
shared: share({
      "package-a": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {resolveGlob: true}
      },
    [...] 
})

shared: share({
      "package-a/themes/xyz": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {skip: "package-a/themes/xyz/*", resolveGlob: true}
      },
    [...] 
})
```

--------------------------------

### Define Monorepo Path Mapping

Source: https://www.npmjs.com/package/%40softarc/native-federation

Example of how internal library paths defined in tsconfig.json are treated as shared libraries by Native Federation.

```JSON
{
  "compilerOptions": {
    "paths": {
      "shared-lib": [
        "libs/shared-lib/index.ts"
      ]
    }
  }
}
```

--------------------------------

### Initialize and Execute Native Federation Build Process

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=readme

Demonstrates the three-step process to integrate Native Federation: initializing the builder with an adapter, triggering the bundler while respecting externals, and executing the final build tasks.

```typescript
import * as esbuild from 'esbuild';
import * as path from 'path';
import { esBuildAdapter } from '@softarc/native-federation-esbuild';
import { federationBuilder } from '@softarc/native-federation/build';

const projectName = 'shell';
const tsConfig = 'tsconfig.json';
const outputPath = `dist/${projectName}`;

await federationBuilder.init({
    options: {
        workspaceRoot: path.join(__dirname, '..'),
        outputPath,
        tsConfig,
        federationConfig: `${projectName}/federation.config.js`,
    },
    adapter: esBuildAdapter
});

await esbuild.build({
    external: federationBuilder.externals,
});

await federationBuilder.build();
```

--------------------------------

### Configure includeSecondaries with skip and glob resolution

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Demonstrates how to fine-tune secondary entry point inclusion using skip lists and glob resolution to manage bundle size and dependency exports.

```javascript
shared: share({
    "@angular/common": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: {
            skip: ['@angular/common/http/testing']
        }
    }
})
```

```javascript
shared: share({
      "package-a": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {resolveGlob: true}
      }
})
```

```javascript
shared: share({
      "package-a/themes/xyz": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {skip: "package-a/themes/xyz/*", resolveGlob: true}
      }
})
```

--------------------------------

### Configure Secondary Entry Points and Glob Resolution

Source: https://www.npmjs.com/package/%40softarc/native-federation

Demonstrates how to fine-tune the inclusion of secondary entry points using skip lists, glob resolution, and the keepAll property to manage shared package versions.

```JavaScript
shared: share({
    "@angular/common": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: {
            skip: ['@angular/common/http/testing']
        }
    },
    "package-a": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {resolveGlob: true}
    },
    "package-a/themes/xyz": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {skip: "package-a/themes/xyz/*", resolveGlob: true}
    },
    "@angular/core": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {keepAll: true}
    }
})
```

--------------------------------

### Initialize Host Application with Manifest File

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Initializes the native federation host using a manifest file that contains the mapping of remote names to their `remoteEntry.json` locations. This approach allows for environment-specific configurations without recompilation. The manifest file itself is a JSON object.

```typescript
import { initFederation } from '@softarc/native-federation';

(async () => {
  await initFederation('assets/manifest.json');

  await import('./app');
})();
```

--------------------------------

### Configure Host Application with Native Federation (CommonJS)

Source: https://www.npmjs.com/package/%40softarc/native-federation

Sets up a host application configuration for Native Federation using `withNativeFederation` and `shareAll`. The `shareAll` helper shares all dependencies from `package.json`. This configuration is typically placed in a `federation.config.js` file.

```javascript
// shell/federation.config.js

const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'host',

  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: 'auto',
      includeSecondaries: false,
    }),
  },
});

```

--------------------------------

### Configure includeSecondaries for shared dependencies

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=readme

Demonstrates how to control the inclusion of secondary entry points for shared packages. This includes skipping specific paths, enabling glob resolution, and using the keepAll property to prevent version mismatches.

```JavaScript
shared: share({
    "@angular/common": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: {
            skip: ['@angular/common/http/testing']
        }
    }
})
```

```JavaScript
shared: share({
      "package-a": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {resolveGlob: true}
      }
})
```

```JavaScript
shared: share({
      "package-a/themes/xyz": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {skip: "package-a/themes/xyz/*", resolveGlob: true}
      }
})
```

```JavaScript
shared: share({
      "@angular/core": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {keepAll: true}
      }
})
```

--------------------------------

### Initialize Host Application with Remote Entry URL

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Initializes the native federation host by providing a mapping of remote names to their respective `remoteEntry.json` URLs. This allows the host to discover and load remote modules. It's an asynchronous operation that should be called on application startup.

```typescript
import { initFederation } from '@softarc/native-federation';

(async () => {
  await initFederation({
    mfe1: 'http://localhost:3001/remoteEntry.json',
  });

  await import('./app');
})();
```

--------------------------------

### Initialize Federation Host

Source: https://www.npmjs.com/package/%40softarc/native-federation

Initializes the federation host by mapping remote names to their entry points. This can be done using a direct object mapping or by referencing a manifest JSON file.

```typescript
import { initFederation } from '@softarc/native-federation';

(async () => {
  await initFederation({
    mfe1: 'http://localhost:3001/remoteEntry.json',
  });

  await import('./app');
})();
```

```typescript
import { initFederation } from '@softarc/native-federation';

(async () => {
  await initFederation('assets/manifest.json');

  await import('./app');
})();
```

```json
{
  "mfe1": "http://localhost:3001/remoteEntry.json"
}
```

--------------------------------

### Configure Remote Exposure and Shared Dependencies

Source: https://www.npmjs.com/package/%40softarc/native-federation

Configures a micro-frontend remote by exposing specific components and applying shared dependency settings using the shareAll helper.

```JavaScript
const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'mfe1',
  exposes: {
    './component': './mfe1/component',
  },
  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: 'auto',
      includeSecondaries: false,
    }),
  },
});
```

--------------------------------

### Configure Host with Overrides for Shared Dependencies (CommonJS)

Source: https://www.npmjs.com/package/%40softarc/native-federation

Configures a host application for Native Federation, allowing specific overrides for shared dependencies using `shareAll`. This enables fine-grained control over how individual packages are shared, including versioning and secondary entry point inclusion.

```javascript
// shell/federation.config.js

const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'host',

  shared: {
    ...shareAll(
      {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
      },
      {
        overrides: {
          'package-a/themes/xyz': {
            singleton: true,
            strictVersion: true,
            requiredVersion: 'auto',
            includeSecondaries: { skip: '@package-a/themes/xyz/*' },
            build: 'package',
          },
          'package-b': {
            singleton: false,
            strictVersion: true,
            requiredVersion: 'auto',
            includeSecondaries: { skip: 'package-b/icons/*' },
            build: 'package',
          },
        },
      },
    ),
  },
});

```

--------------------------------

### Configure esbuild Adapter with React Replacements

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=versions

Configures the esbuild adapter for Native Federation, including file replacements for React to handle CommonJS modules. The `reactReplacements.prod` provides necessary adjustments for production builds.

```typescript
import { reactReplacements } from '@softarc/native-federation-esbuild/src/lib/react-replacements';
import { createEsBuildAdapter } from '@softarc/native-federation-esbuild';

[...] 

createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod
})
```

--------------------------------

### Share Helper with Additional Options

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Demonstrates the use of the `share` helper function to configure shared dependencies with additional options like `requireVersion: 'auto'` and `includeSecondaries`. This provides more control over how dependencies are shared across applications.

```javascript
shared: share({
    "package-a": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: true
    },
    [...] 
})
```

--------------------------------

### Augment Build Process with Native Federation (esbuild)

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Integrates Native Federation into the esbuild build process by initializing the `federationBuilder`, triggering the build, and performing additional tasks for Native Federation support. Requires esbuild, path, fs, and Native Federation adapters.

```typescript
import * as esbuild from 'esbuild';
import * as path from 'path';
import * as fs from 'fs';
import { esBuildAdapter } from '@softarc/native-federation-esbuild';
import { federationBuilder } from '@softarc/native-federation/build';


const projectName = 'shell';
const tsConfig = 'tsconfig.json';
const outputPath = `dist/${projectName}`;

/*
  *  Step 1: Initialize Native Federation
*/
await federationBuilder.init({
    options: {
        workspaceRoot: path.join(__dirname, '..'),
        outputPath,
        tsConfig,
        federationConfig: `${projectName}/federation.config.js`,
        verbose: false,
    },

    /*
        * As this core lib is tooling-agnostic, you
        * need a simple adapter for your bundler.
        * It's just a matter of one function.
    */
    adapter: esBuildAdapter
});

/*
  * Step 2: Trigger your build process
  * 
  * You can use any tool for this. Here, we go
  * with a very simple esbuild-based build.
  * 
  * Just respect the externals in
  * `federationBuilder.externals`.
*/

[...] 

await esbuild.build({
    [...] 
    external: federationBuilder.externals,
    [...] 
});

[...] 

/*
  * Step 3: Let the build method do the additional tasks
  *   for supporting Native Federation
*/

await federationBuilder.build();
```

--------------------------------

### Share Helper with Additional Options (CommonJS)

Source: https://www.npmjs.com/package/%40softarc/native-federation

Demonstrates the use of the `share` helper function within Native Federation configuration to add specific options like `requireVersion: 'auto'` and `includeSecondaries` for shared dependencies. This provides more control over how dependencies are managed.

```javascript
shared: share({
    "package-a": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: true
    },
    [...] 
})

```

--------------------------------

### Configure Host with Overrides for Shared Dependencies (CommonJS)

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Configures a host application for Native Federation, allowing specific overrides for shared dependencies. This enables fine-grained control over versioning and inclusion of secondary entry points for packages.

```javascript
// shell/federation.config.js

const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'host',

  shared: {
    ...shareAll(
      {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
      },
      {
        overrides: {
          'package-a/themes/xyz': {
            singleton: true,
            strictVersion: true,
            requiredVersion: 'auto',
            includeSecondaries: { skip: '@package-a/themes/xyz/*' },
            build: 'package',
          },
          'package-b': {
            singleton: false,
            strictVersion: true,
            requiredVersion: 'auto',
            includeSecondaries: { skip: 'package-b/icons/*' },
            build: 'package',
          },
        },
      },
    ),
  },
});
```

--------------------------------

### Initialize Federation Remote

Source: https://www.npmjs.com/package/%40softarc/native-federation

Initializes a remote application. If no further remotes are loaded into this remote, no parameters are required.

```typescript
import { initFederation } from '@softarc/native-federation';

(async () => {
  await initFederation();
  await import('./component');
})();
```

--------------------------------

### Share All Dependencies with shareAll

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=code

The `shareAll` helper function shares all dependencies listed in the `package.json`. This ensures dependencies are loaded only once across the application. Dependencies can be opted out of sharing using the `skip` option.

```javascript
module.exports = withNativeFederation({
  [...] 

  // Don't share my-lib
  skip: [
    'my-lib'
  ]

  [...] 
})
```

```javascript
const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'mfe1',

  exposes: {
    './component': './mfe1/component',
  },

  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: 'auto',
      includeSecondaries: false,
    }),
  },
});
```

--------------------------------

### Augment Build Process with Native Federation (esbuild)

Source: https://www.npmjs.com/package/%40softarc/native-federation

Integrates Native Federation into the esbuild build process by initializing the `federationBuilder`, triggering the esbuild build with federated externals, and finally calling `federationBuilder.build()` to complete the process. Requires `@softarc/native-federation-esbuild` and `@softarc/native-federation/build`.

```typescript
import * as esbuild from 'esbuild';
import * as path from 'path';
import * as fs from 'fs';
import { esBuildAdapter } from '@softarc/native-federation-esbuild';
import { federationBuilder } from '@softarc/native-federation/build';


const projectName = 'shell';
const tsConfig = 'tsconfig.json';
const outputPath = `dist/${projectName}`;

/*
  *  Step 1: Initialize Native Federation
*/
await federationBuilder.init({
    options: {
        workspaceRoot: path.join(__dirname, '..'),
        outputPath,
        tsConfig,
        federationConfig: `${projectName}/federation.config.js`,
        verbose: false,
    },

    /*
        * As this core lib is tooling-agnostic, you
        * need a simple adapter for your bundler.
        * It's just a matter of one function.
    */
    adapter: esBuildAdapter
});

/*
  * Step 2: Trigger your build process
  * 
  * You can use any tool for this. Here, we go
  * with a very simple esbuild-based build.
  * 
  * Just respect the externals in
  * `federationBuilder.externals`.
*/

[...] 

await esbuild.build({
    [...] 
    external: federationBuilder.externals,
    [...] 
});

[...] 

/*
  * Step 3: Let the build method do the additional tasks
  *   for supporting Native Federation
*/

await federationBuilder.build();

```

--------------------------------

### Manage Shared Dependencies with Share Helper

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=readme

Utilizes the share helper to define specific dependency configurations and set global version inference.

```javascript
shared: share({
    "package-a": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: true
    }
});

setInferVersion(true);
```

--------------------------------

### Configure React Replacements for esbuild Adapter

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Sets up the esbuild adapter for native federation, specifically addressing challenges with CommonJS libraries like React. It includes `fileReplacements` for production mode and optionally `compensateExports` to ensure exports are not lost for specified libraries.

```typescript
import { reactReplacements } from '@softarc/native-federation-esbuild/src/lib/react-replacements';
import { createEsBuildAdapter } from '@softarc/native-federation-esbuild';

[...] 

createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod
})
```

```typescript
createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod,
  compensateExports: [new RegExp('/my-lib/')],
});
```

--------------------------------

### Configure Secondary Entry Points with includeSecondaries

Source: https://www.npmjs.com/package/@softarc/native-federation?activeTab=versions

This snippet demonstrates how to configure the `includeSecondaries` option within the `share` function. It shows how to either include all secondary entry points or skip specific ones, such as '@angular/common/http/testing'. This is useful for fine-grained control over shared dependencies.

```javascript
shared: share({
    "@angular/common": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: {
            skip: ['@angular/common/http/testing']
        }
    },
    [...] 
})
```

--------------------------------

### Configure Import Map Polyfill

Source: https://www.npmjs.com/package/%40softarc/native-federation

Configures the es-module-shims polyfill to support Import Maps in browsers that do not natively support the feature.

```html
<script type="esms-options">
  {
      "shimMode": true,
      "mapOverrides": true
  }
</script>

<script src="https://ga.jspm.io/npm:es-module-shims@1.5.17/dist/es-module-shims.js"></script>

<script type="module-shim" src="main.js"></script>
```

--------------------------------

### Configure Remotes with Exposes

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=code

When configuring a remote, the `exposes` property allows specifying files to be loaded into the shell at runtime. This enables micro frontends to expose their components or modules to other parts of the application.

```javascript
const { withNativeFederation, shareAll } = require('@softarc/native-federation/build');

module.exports = withNativeFederation({
  name: 'mfe1',

  exposes: {
    './component': './mfe1/component',
  },

  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: 'auto',
      includeSecondaries: false,
    }),
  },
});
```

--------------------------------

### Exclude Dependencies from Sharing

Source: https://www.npmjs.com/package/%40softarc/native-federation

Shows how to opt-out specific libraries from the automatic sharing process within the withNativeFederation configuration.

```JavaScript
module.exports = withNativeFederation({
  skip: [
    'my-lib'
  ]
})
```

--------------------------------

### Configure Secondary Entry Points with includeSecondaries

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=code

The `includeSecondaries` option controls whether all secondary entry points of a shared package are included. It can be set to `true` to include all, `false` to include none, or an object to specify which ones to skip. This is useful for fine-grained control over shared dependencies.

```javascript
shared: share({
    "@angular/common": {
        singleton: true,
        strictVersion: true,
        requiredVersion: 'auto',
        includeSecondaries: {
            skip: ['@angular/common/http/testing']
        }
    },
    [...]
})
```

--------------------------------

### Define Federation Manifest

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=code

A JSON manifest file that maps remote names to their respective remoteEntry.json URLs, allowing environment-specific configuration without recompilation.

```json
{
  "mfe1": "http://localhost:3001/remoteEntry.json"
}
```

--------------------------------

### Configure esbuild Adapter with Compensate Exports

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=versions

Configures the esbuild adapter with `compensateExports` to ensure proper handling of exports from CommonJS libraries. This is particularly useful for libraries that dynamically use the `exports` object, with a default regex targeting React.

```typescript
createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod,
  compensateExports: [new RegExp('/my-lib/')],
});
```

--------------------------------

### Load Remote Module with Type Hint

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=versions

Loads a module from a remote application and provides a type parameter for better type safety. This is useful when the structure or interface of the loaded module is known.

```typescript
const module = await loadRemoteModule<MyRemoteType>({
  remoteName: 'mfe1',
  exposedModule: './component',
});
```

--------------------------------

### Enable Automatic Version Inference (JavaScript)

Source: https://www.npmjs.com/package/%40softarc/native-federation

Activates automatic version inference for shared dependencies in Native Federation by calling `setInferVersion(true)`. This simplifies configuration by automatically using versions defined in `package.json`, helping to resolve peer dependency issues.

```javascript
setInferVersion(true);

```

--------------------------------

### Enforce dependency consistency with keepAll

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Uses the keepAll property to prevent cross-version secondary entry point issues by forcing consistent versions across micro frontends.

```javascript
shared: share({
      "@angular/core": {
        singleton: true,
        strictVersion: true,
        requiredVersion: "auto",
        includeSecondaries: {keepAll: true}
      }
})
```

--------------------------------

### Configure CommonJS Compatibility

Source: https://www.npmjs.com/package/%40softarc/native-federation

Configures the ESBuild adapter to handle CommonJS libraries like React. Uses file replacements and export compensation to ensure compatibility.

```typescript
import { reactReplacements } from '@softarc/native-federation-esbuild/src/lib/react-replacements';
import { createEsBuildAdapter } from '@softarc/native-federation-esbuild';

createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod
});
```

```typescript
createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod,
  compensateExports: [new RegExp('/my-lib/')]
});
```

--------------------------------

### Configure CommonJS Compatibility

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=readme

Configures the ESBuild adapter to handle CommonJS libraries like React. Uses file replacements and export compensation to ensure compatibility with modern ESM environments.

```typescript
import { reactReplacements } from '@softarc/native-federation-esbuild/src/lib/react-replacements';
import { createEsBuildAdapter } from '@softarc/native-federation-esbuild';

createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod
});
```

```typescript
createEsBuildAdapter({
  plugins: [],
  fileReplacements: reactReplacements.prod,
  compensateExports: [new RegExp('/my-lib/')],
});
```

--------------------------------

### Enable Automatic Version Inference

Source: https://www.npmjs.com/package/%40softarc/native-federation?activeTab=dependents

Enables automatic inference of package versions based on `package.json` by calling `setInferVersion(true)`. This simplifies version management for shared dependencies, especially when dealing with peer dependencies and secondary entry points.

```javascript
setInferVersion(true);
```
Tokens:
Raw