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

feat(wasm): allow WebAssembly module filenames to use more path templates (e.g. [file], [base]) #10202

Open
wants to merge 12 commits into
base: main
Choose a base branch
from

Conversation

knagaitsev
Copy link

Solves #9517 (I used this to dive into the webpack source a bit since this issue looked inactive)

The problem is that currently you can only use [hash] to set a wasm output filename:

output: {
  webassemblyModuleFilename: "[hash].wasm"
},

More options would be useful, such as: [base].wasm, etc.

Changes were needed in TemplatedPathPlugin.js because the wasm path templates were not being set correctly. For example, in the output, I would get the path string:

readFile(join(__dirname, "[base].wasm"), ...

but, I wanted the output:

readFile(join(__dirname, "" + {"./wasm.wat":"wasm.wat"}[wasmModuleId] + ".wasm"), ...

I adjusted the TemplatedPathPlugin so that it could be easier to handle the many templates that stem from the filename property (e.g. base, ext, file) in this situation.

I added tests using configs that encompass many of the template cases: webassemblyModuleFilename: "[fullhash].[hash].[hash:16].[base][ext].wasm"

What kind of change does this PR introduce?

feature

Did you add tests for your changes?

Yes

Does this PR introduce a breaking change?

No, there should be no breaking changes.

What needs to be documented once your changes are merged?

wasm in general seems to not be documented well, so that in addition to the new path templates for webassemblyModuleFilename.

@webpack-bot
Copy link
Contributor

For maintainers only:

  • This needs to be documented (issue in webpack/webpack.js.org will be filed when merged)
  • This needs to be backported to webpack 4 (issue will be created when merged)

@webpack-bot
Copy link
Contributor

Thank you for your pull request! The most important CI builds succeeded, we’ll review the pull request soon.

Comment on lines 13 to 18
let found = false;
stats.assets.forEach((asset) => {
found = found || !!asset.name.match(
/^\w{20}\.\w{20}\.\w{16}\.wasm\.wat\.wat\.wasm$/
);
});
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

        const found = stats.assets.every((asset) => {
            !!asset.name.match(
                /^\w{20}\.\w{20}\.\w{16}\.wasm\.wat\.wat\.wasm$/
            );
        });

What about this approach?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jamesgeorge007 Good idea, I did this with the slight change that it should be .some rather than .every (I'm looking for only one outputted file that matches this reg exp).

Comment on lines 13 to 18
let found = false;
stats.assets.forEach((asset) => {
found = found || !!asset.name.match(
/^\w{20}\.\w{20}\.\w{16}\.wasm\.wat\.wat\.wasm$/
);
});
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Successfully merging this pull request may close these issues.

None yet

3 participants