未检测到magic标头使用以下加载程序处理了文件:*/node_modules/wasm-loader/index.js

Question

我在React with Typescript中使用webassembly wasm文件时遇到问题。

我已经安装了react-app-rewired和wasm-loader以及我的config-overrides.js:

const path = require('path');
module.exports = function override(config, env) {
const wasmExtensionRegExp = /.wasm$/;
config.resolve.extensions.push('.wasm');
config.module.rules.forEach(rule => {
(rule.oneOf || []).forEach(oneOf => {
if (oneOf.loader && oneOf.loader.indexOf('file-loader') >= 0) {
// make file-loader ignore WASM files
oneOf.exclude.push(wasmExtensionRegExp);
}
});
});
// add a dedicated loader for WASM
config.module.rules.push({
test: wasmExtensionRegExp,
include: path.resolve(__dirname, 'src'),
use: [{ loader: require.resolve('wasm-loader'), options: {} }]
});
return config;
};

在json包中，我更改为使用"start": "react-app-rewired start",但是仍然具有相同的错误。如何解决这个问题？非常感谢。

Answer 1

"未检测到魔术头"；表示您的.wasm文件实际上不是.wasm文件。你能用wasm-objdump验证它是一个有效的文件吗？