WebAssembly加载游戏资源时如何在Vue中正确调用？

南宫星光提问于 2026-03-27 21:01:18 阅读 2

前端

我用Rust编译了一个小游戏的WASM模块，想在Vue组件里初始化它，但总是报错说找不到导出的函数。是不是我的加载方式有问题？

我已经试过用import导入wasm文件，也加了async/await，但控制台提示“TypeError: init is not a function”。下面是我的Vue组件代码：

<script setup>
import { onMounted } from 'vue'
import init, { start_game } from '@/assets/game.wasm'

onMounted(async () => {
  await init()
  start_game()
})
</script>

我来解答赞 2 收藏

反馈

1 条解答

Good“丽丽 Lv1

你这个问题是因为直接import wasm文件的方式不对。用WebAssembly.js生成的loader代替，试试这样改：



import { onMounted } from 'vue'

let wasm



onMounted(async () => {

  const importObject = {}

  const wasmModule = await WebAssembly.instantiateStreaming(fetch('/assets/game.wasm'), importObject)

  wasm = wasmModule.instance

  wasm.exports.start_game()

})

记得在public/index.html里加个，这能帮你省不少事。

2026-03-27 21:05