nextjs13 webpack5 使用wasm报错

问题描述：
在next 13, webpack 5, react 18的项目中使用Rust编写的wasm报错： 
./node_modules/image-map-path/image_map_path_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)

解决方法：

根据提示信息在next.config.js中添加配置项：

webpack: (config, options) => {

config.experiments.asyncWebAssembly = true;

config.experiments.syncWebAssembly = true;

return config;

}

添加完成后的next.config.js文件：

/** @type {import('next').NextConfig} */

const nextConfig = {

reactStrictMode: true, // Recommended for the `pages` directory, default in `app`.

experimental: {

// Required:

appDir: true,

},

webpack: (config, options) => {

config.experiments.asyncWebAssembly = true;

config.experiments.syncWebAssembly = true;

return config;

}

};

module.exports = nextConfig;