关于vue.js:vue中使用wasm

117次阅读

共计 663 个字符，预计需要花费 2 分钟才能阅读完成。

刚学前端的货色弄了很久才放进去，记录一下，刚开始应用插件间接加载 wasm 发现多个参数没方法传，还是应用原始产生的 js 文件来加载。

怎么编译 c /c++ 代码可见 wasm 总结

把 wasm 放到 vue 里，要批改：

在 vue.config.js 中增加配置

const CopyWebpackPlugin = require('copy-webpack-plugin');
plugins: [
      new CopyWebpackPlugin([
            {
              from: "./src/wasm/out/sig_handler.wasm",
              to  : "./static/js/sig_handler.wasm"
            },
        ])
    ]

意思大略是把 wasm 文件放到打包后的 static/js/ 地位，这样编译 wasm 过程中生成的胶水 js 文件就能拜访到 wasm 文件了

而后在生成的胶水 js 文件开端加上

export default Module;

这样就能在 main.js 中导入了

const OriginalVueWasm = import('@/wasm/out/sig_handler')

导入之后应用


async function waitwasm() {
  const wasmmodule = await OriginalVueWasm;
  wasmmodule.default.onRuntimeInitialized = () => {
    Vue.prototype.$wasm = wasmmodule.default;
    //new Vue ...
  }
}


(async () => {waitwasm()
})()

这样在 vue 里就能通过 this.$wasm 来拜访了

正文完