How to import open-im-sdk-wasm in webpack4.x
unicycle-master opened this issue · 3 comments
unicycle-master commented
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
Bloomingg commented
- add patch-package
npm i patch-package
- update package.josn scripts
"scripts": {
+ "postinstall": "patch-package"
}
- 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,
}),
});
}
- patch change
npx patch-package open-im-sdk-wasm
- add web worker loader
npm i worker-loader worker-plugin -D
- update webpack config
const WorkerPlugin = require("worker-plugin");
...
plugins: [new WorkerPlugin()]
...
- import and use
import { getSDK } from 'open-im-sdk-wasm';
const IMSDK = getSDK();
15949634581 commented
Bloomingg commented