Import WASM as Installed Package Failing
Unanswered
Spectacled bear posted this in #help-forum
Spectacled bearOP
I have built a WASM module and gotten it to work within an initial Next.js app. I built it with
example:
const wasm = await import("@/wasm/my_module/my_module");
While, I am able to install the package by pointing npm to the package directory:
npm i ../my_module/pkg
I have not been able to import from the installed package.
const wasm = await import("my_module"); // This gives me a runtime error of "Module not found: Can't resolve 'my_module'"
I would like to be able to import my wasm from an installed NPM package.
wasm-pack build --target web. So far, I've only been able to get it working within Next.js by copying the package files into a directory within my Next.js project. I can then import it by directly pointing to the folder within:example:
const wasm = await import("@/wasm/my_module/my_module");
While, I am able to install the package by pointing npm to the package directory:
npm i ../my_module/pkg
I have not been able to import from the installed package.
const wasm = await import("my_module"); // This gives me a runtime error of "Module not found: Can't resolve 'my_module'"
I would like to be able to import my wasm from an installed NPM package.
10 Replies
Spectacled bearOP
I feel I should mention, I'm rather comfortable with Rust, which is what I'm building my WASM module from. But I'm very new to JavaScript, React, etc.
@Spectacled bear I feel I should mention, I'm rather comfortable with Rust, which is what I'm building my WASM module from. But I'm very new to JavaScript, React, etc.
Black imported fire ant
You wanna use the module that you built?
@Black imported fire ant You wanna use the module that you built?
Spectacled bearOP
yeah
Black imported fire ant
I see
In this case, you can't use npm i
You can put it in your public folder and try to import it.
Spectacled bearOP
There was a method I found that had me put the files in a wasm folder in the root of the Next.js project and reference that with a string like "@/wasm/..."
That does work. I guess it just doesn't seem ideal.
That does work. I guess it just doesn't seem ideal.
@Spectacled bear There was a method I found that had me put the files in a wasm folder in the root of the Next.js project and reference that with a string like "@/wasm/..."
That does work. I guess it just doesn't seem ideal.
Black imported fire ant
In this case, you need to define something into tsconfig.json.
Spectacled bearOP
Oh ok, can you give me some details on what I would need to definite in there? Or can you point me to an example?
@Spectacled bear Oh ok, can you give me some details on what I would need to definite in there? Or can you point me to an example?
Black imported fire ant
"paths": {
"@/": ["./src/"]
}
"@/": ["./src/"]
}