Skip to content

webpack output.scriptType: 'module' in combination with publicPath: 'auto' not handled #3882

@tringenbach

Description

@tringenbach

Describe the bug

In my remote (producer), I tried to set my publicPath to auto. Then I started getting errors about using import.meta.url in a non-module.

After much digging, I discovered that my configuration is setting output.scriptType was set to module, even though output.module was not set.
(I actually am not sure where that setting is coming from, but I don't think that is the Module Federation plugin's doing.)

This seems to cause webpack to not use any import or export ESM statements, but to use import.meta.url for determining the publicPath.

MF2 generates a mf-manifest.json that specifies the remoteEntry is type var, and that causes it to load the module with a script tag without type="module" set, which fails due to the use of import.meta.url.

The index.html produced by webpack does have the type="module" attributes set.

I attempted to "fix" this with a runtime plugin that adds the "module" attribute. This alone did not help. The remote entry js file was indeed in "var" mode, and the export of the module was set on a "global"ish variable. (A var at the top level of the .js file, which would be a global if loaded without type=module but that is scoped to the module when loaded with type=module).

I added

library: {
  name: '<same name passed to `name`>,
  type: 'global',
}

to my MF2 webpack plugin options, and that, along with my runtime plugin that adds the type="module" attribute, fixed my issue.

(I may instead change my output.scriptType setting. I am not sure why it was set to module.)

It is somewhat related #3550 though this is a different bundler and probably a different underlying issue.

Reproduction

tbd. I'll go back and create one.

Used Package Manager

yarn

System Info

MF2 version: 0.13.1
webpack: 5.88.2

Validations

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions