openimsdk/open-im-sdk-web-wasm

How to import open-im-sdk-wasm in webpack4.x

unicycle-master opened this issue · 3 comments

What would you like to share?

How to use openIM3. x without upgrading to webpack5, the webpack ^ 4.4.2 used in Vue2

Additional information

No response

  1. add patch-package
npm i patch-package
  1. update package.josn scripts
"scripts": {
+  "postinstall": "patch-package"
 }
  1. update open-im-sdk-wasm

node_modules->open-im-sdk-wasm->lib->index.js(index.es.js)

function initWorker() {
    if (typeof window === 'undefined') {
        return;
    }
    // use for webpack 4
    const IMWorker = require('worker-loader!./worker.js');
    worker = new IMWorker.default();
    // use for webpack5+ or vite
    // const isViteEnvironment = import.meta.url.includes('.vite/deps');
    // const isSupportModuleWorker = supportsModuleWorkers();
    // const getWorkerUrl = (url) => url.href.replace('.vite/deps', 'open-im-sdk-wasm/lib');
    // const workerUrl = isSupportModuleWorker
    //     ? new URL('worker.js', import.meta.url)
    //     : new URL('worker-legacy.js', import.meta.url);
    // worker = new Worker(isViteEnvironment ? getWorkerUrl(workerUrl) : workerUrl, {
    //     type: isSupportModuleWorker ? 'module' : 'classic',
    // });
    // This is only required because Safari doesn't support nested
    // workers. This installs a handler that will proxy creating web
    // workers through the main thread
    initBackend(worker);
    rpc = new RPC({
        event: new RPCMessageEvent({
            currentEndpoint: worker,
            targetEndpoint: worker,
        }),
    });
}
  1. patch change
npx patch-package open-im-sdk-wasm
  1. add web worker loader
npm i worker-loader worker-plugin -D
  1. update webpack config
const WorkerPlugin = require("worker-plugin");

...
plugins: [new WorkerPlugin()]
...
  1. import and use
import { getSDK } from 'open-im-sdk-wasm';

const IMSDK = getSDK();

企业微信截图_17228262975782
按照上面执行完之后报这个异常怎么解决,之前也出现过但过了一天自己就好了,这次更新了一下sdk又有这个问题了

企业微信截图_17228262975782 按照上面执行完之后报这个异常怎么解决,之前也出现过但过了一天自己就好了,这次更新了一下sdk又有这个问题了

It looks like it failed when calling the cache API. You can raise a separate issue to discuss this issue.