feat(react): Add versioning for workspace libraries

[ndcunningham]

This PR grants users the ability to add versioning for their workspace libraries.

At build time inside withModuleFederation get each workspace library's version by:

1. Looking at the parent's package.json to get the version range
2. If not found in the root we look at the library's package.json to get the fixed version
3. If neither is found, we do not do any versioning and the functionality remains as is currently.

If the need arises where you do not want this functionality (since it is the current default) you can override it by using the shared API inside of the module-federation.config.js.

When your code is built you can check the build artifact's remoteEntry.js for your host/remote and you should see your workspace library registered with a version.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
nx-dev	⬜️ Ignored (Inspect)	Visit Preview		Sep 13, 2023 7:50pm

[nx-cloud]

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 240d0a2. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

---

✅ Successfully ran 8 targets

• nx affected --target=e2e --base=769974b45a02ca31d338050b340c49e18dfa939a --head=240d0a20251070aea71b887106e1095bfe0643c8 --parallel=1
• nx affected --target=test --base=769974b45a02ca31d338050b340c49e18dfa939a --head=240d0a20251070aea71b887106e1095bfe0643c8 --parallel=1
• nx affected --target=build --base=769974b45a02ca31d338050b340c49e18dfa939a --head=240d0a20251070aea71b887106e1095bfe0643c8 --parallel=3
• nx affected --target=lint --base=769974b45a02ca31d338050b340c49e18dfa939a --head=240d0a20251070aea71b887106e1095bfe0643c8 --parallel=3
• nx run-many -t check-imports check-commit check-lock-files check-codeowners documentation --parallel=1 --no-dte
• nx-cloud record -- nx format:check --base=769974b45a02ca31d338050b340c49e18dfa939a --head=240d0a20251070aea71b887106e1095bfe0643c8
• nx documentation --no-dte
• nx affected -t e2e-macos --parallel=1 --base=769974b45a02ca31d338050b340c49e18dfa939a --head=240d0a20251070aea71b887106e1095bfe0643c8

---

Sent with 💌 from NxCloud.

[Coly010]

I'm not sure this is the correct approach.

When we run the build of a remote or host, the ModuleFederationPlugin will read the package.json of the workspace libraries, if it exists, and set the version in its register function to that version. If it doesn't exist it sets it to 0.0.0.

We do set requiredVersion: false in the shareWorkspaceLibraries config. Instead, we should potentially switch this to be

requiredVersion: workspaceLib.packageJson?.version ?? false

Then the user can define a range of versions of the library that the app is compatible with in their shared function in the module-federation.config if they desire, otherwise, we'll have it pinned to the version of the library at the time the app was built:

shared: (libraryName, libraryConfig) => {
  if(libraryName === '@acme/mylib') {
     return {
         ...libraryConfig,
        requiredVersion: "~1.0.0"
  } 
}

If their workspace library does not have a package.json file, they can add one with just "version": "1.0.0" .

I tested this out locally, and it does work. If the remote and the host have different versions set in their shared function, then they just use their own version, otherwise, it uses a shared version between them.

This should also reduce the need of an additional property in the config.

[jaysoo]

Maybe a clean-up item later, but it'd be nice to use either a real fs, or mem-fs here. Spying and mocking like this couples the test to the implementation too much. For example, if existsSync and realTsPathMappings are replaced with something else we'd have to update unit tests.

mem-fs can be used like:

import 'nx/src/utils/testing/mock-fs';
import { vol } from 'memfs';

// ...
vol.fromJson({
  'tsconfig.base.json': { ... },
  // ...
}, '/');

[ndcunningham]

This is probably a cleanup task. If we are changing over to use this it would make sense to update all the unit test inside share.spec.ts

[Coly010]

LGTM! 🎉

in a follow up task we should add or change the e2e to build the shell, then change the version of the lib, then build the remote.

then we should read the main.js file of the shell to find the version the library is being registered with by MFP, and check it is at the earlier version, and then we should look for the same line in the remote’s remoteEntry.mjs and check its version matches the new version.

[github-actions]

This pull request has already been merged/closed. If you experience issues related to these changes, please open a new issue referencing this pull request.