How do I resolve this Webpack issue with Mesh library on NextJS project

Question

I am trying to set up Mesh library on an existing NextJS project. I am not sure how to handle an issue that seems to be with the Webpack configuration for handling wasm files in the library. I am adding the library and configuration using the guide provided here by Mesh.dev.

The error after starting the NextJS project server is:

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
error - ./node_modules/@emurgo/cardano-message-signing-browser/cardano_message_signing_bg.wasm
Module parse failed: Unexpected character '' (1:0)
The module seem to be a WebAssembly module, but module is not flagged as WebAssembly module for webpack.
BREAKING CHANGE: Since webpack 5 WebAssembly is not enabled by default and flagged as experimental feature.
You need to enable one of the WebAssembly experiments via 'experiments.asyncWebAssembly: true' (based on async modules) or 'experiments.syncWebAssembly: true' (like webpack 4, deprecated).
For files that transpile to WebAssembly, make sure to set the module type in the 'module.rules' section of the config (e. g. 'type: "webassembly/async"').
(Source code omitted for this binary file)

Import trace for requested module:
./node_modules/@emurgo/cardano-message-signing-browser/cardano_message_signing_bg.wasm
./node_modules/@emurgo/cardano-message-signing-browser/cardano_message_signing.js
./node_modules/@meshsdk/core/dist/core.js
./node_modules/@meshsdk/react/dist/react.js