刚学前端的货色弄了很久才放进去,记录一下,刚开始应用插件间接加载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来拜访了