Native Federation - Import module before initFederation (skip list not working)

Hello,

I'm unable to import a module before initFederation() in my main.ts. Here is the bootstrap function:

import { initFederation } from '@angular-architects/native-federation';

async function bootstrap() {
  await import('@my-module');

  initFederation({
    'my-micro-mf': 'http://localhost:4201/remoteEntry.js',
  })
    .catch(err => console.error(err))
    .then(() => import('./bootstrap'))
    .then(m => m.bootstrapApp())
    .catch(err => console.error(err));
}

bootstrap();

I need to import @my-module before initFederation, but the browser console shows this error:

zone.js:1049 Error: Unsupported Content-Type "text/html" loading http://localhost:4200/@id/@my-module. Modules must be served with a valid MIME type like application/javascript. at fetchModule (es-module-shims.js:840:13) at async es-module-shims.js:881:40

Related with this issue that has a similar workaround https://github.com/angular-architects/module-federation-plugin/issues/464, it may be solved if I import @my-module in the skip list in federation.config.js. I have done that just as @manfredsteyer commented.

 const {
  withNativeFederation,
  shareAll,
} = require('@angular-architects/native-federation/config');

module.exports = withNativeFederation({
  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: 'auto',
    }),
  },
  skip: [
    'rxjs/ajax',
    'rxjs/fetch',
    'rxjs/testing',
    'rxjs/webSocket',
    '@my-module',
    'compression',
    // Add further packages you don't need at runtime
  ],
});

Importing the module in the skip list have changed the error to this:

zone.js:1049 Error: Unsupported Content-Type "text/html" loading http://localhost:4200/@id/@angular/core imported from http://localhost:4200/@fs/Users/my-user/my-workspace/.angular/cache/17.3.5/vite/deps/@my-module.js?v=8c36e771. Modules must be served with a valid MIME type like application/javascript. at fetchModule (es-module-shims.js:840:13) at async es-module-shims.js:881:40

Now the error seems related to @angular/core. I have checked @my-module peerDependencies and it requires of @angular/core. So what should I do to import this module before initFederation()?

What might be the correct approach?

Thank you in advance.

angular-architects / module-federation-plugin

Native Federation - Import module before initFederation (skip list not working) #542