Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

angular12-microfrontends error when no packages shared #2331

Closed
koshdim opened this issue Sep 28, 2022 · 5 comments
Closed

angular12-microfrontends error when no packages shared #2331

koshdim opened this issue Sep 28, 2022 · 5 comments

Comments

@koshdim
Copy link

koshdim commented Sep 28, 2022

if I clear 'shared' in both shell and profile, I get an error when navigate to microfrontend

plugins: [
    new ModuleFederationPlugin({
      name: 'profile',
      library: { type: 'var', name: 'profile' },
      filename: 'remoteEntry.js',
      exposes: {
        ProfileModule: './projects/mdmf-profile/src/app/profile/profile.module.ts',
      },
      shared: {
      },
    }),
  ],
plugins: [
    new ModuleFederationPlugin({
      shared: {
      },
    }),
  ],
ERROR Error: Uncaught (in promise): Error: inject() must be called from an injection context
Error: inject() must be called from an injection context
    at yD (441.js:1:26044)
    at Object.gt (441.js:1:26219)
    at d.ɵfac [as factory] (441.js:1:168088)
    at AE.hydrate (main.js:1:201332)
    at AE.get (main.js:1:199395)
    at main.js:1:199708
    at Set.forEach (<anonymous>)
    at AE._resolveInjectorDefTypes (main.js:1:199692)
    at new iS (main.js:1:230293)
    at hd.create (main.js:1:230989)
    at Ge (polyfills.js:1:162723)
    at Ge (polyfills.js:1:162219)
    at polyfills.js:1:163611
    at ce.invokeTask (polyfills.js:1:153753)
    at Object.onInvokeTask (main.js:1:235279)
    at ce.invokeTask (polyfills.js:1:153672)
    at _e.runTask (polyfills.js:1:149032)
    at Q (polyfills.js:1:155855)

I assume 'profile' misses some libraries and therefore is unable to load.
how can I configure profile to include all it needs in remoteEntry.js?

@koshdim
Copy link
Author

koshdim commented Sep 28, 2022

same with angular13 project, just the error is slightly different

main.js:1 ERROR Error: Uncaught (in promise): Error: NG0203
Error: NG0203
    at Eg (263.js:1:54171)
    at Object.Bt (263.js:1:54322)
    at d.ɵfac [as factory] (263.js:1:195691)
    at uv.hydrate (main.js:1:121536)
    at uv.get (main.js:1:119126)
    at main.js:1:119933
    at Set.forEach (<anonymous>)
    at uv._resolveInjectorDefTypes (main.js:1:119917)
    at new wp (main.js:1:136906)
    at Ul.create (main.js:1:137606)
    at q (polyfills.js:1:17670)
    at q (polyfills.js:1:17205)
    at polyfills.js:1:18515
    at v.invokeTask (polyfills.js:1:8244)
    at Object.onInvokeTask (main.js:1:151185)
    at v.invokeTask (polyfills.js:1:8165)
    at v.runTask (polyfills.js:1:3302)
    at A (polyfills.js:1:10634)
    at v.invokeTask [as invoke] (polyfills.js:1:9407)
    at g (polyfills.js:1:22992)

@ScriptedAlchemy
Copy link
Member

Doesnt angular use a custom federation plugin? from angular architects?

File the bug with them, not a webpack issue

@koshdim
Copy link
Author

koshdim commented Sep 29, 2022

angular12 example doesn't use angular architects package

@koshdim
Copy link
Author

koshdim commented Sep 29, 2022

here is webpack-y error:

TypeError: _angular_core__WEBPACK_IMPORTED_MODULE_0__.InjectionToken is not a constructor
    4666 Angular
    Webpack 20
        __webpack_require__
        4497
        __webpack_require__
        8596
        __webpack_require__
        invoke
        run
        scheduleResolveOrReject
        invokeTask
        runTask
        drainMicroTaskQueue
        promise callback*scheduleMicroTask
        scheduleTask
        scheduleTask
        scheduleMicroTask
        scheduleResolveOrReject
        resolvePromise
        makeResolver
        webpackJsonpCallback
        <anonymous>

how do I investigate this? was module loaded, was all components of the module loaded?

@ScriptedAlchemy
Copy link
Member

Looks like Babel transform maybe. Class getting converted into function call instead or true class

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants