Do you have sql.js as a dependency on your pure JS...
# squarelibraries
d
Do you have sql.js as a dependency on your pure JS project?
x
yes
Copy code
"dependencies": {
    ...
    "sql.js": "^1.5.0",
    ...
  },
d
Try updating it to 1.6.2
It has to match the version that the sqljs driver was compiled with
x
i see - let me try that out
hmm getting the same magic handshake error still
Copy code
Uncaught (in promise) RuntimeError: abort(CompileError: WebAssembly.instantiate(): expected magic word 00 61 73 6d, found 3c 21 44 4f @+0). Build with -s ASSERTIONS=1 for more info.
    at F (sql-wasm.js:106)
    at sql-wasm.js:165
d
Ah, you might be hitting a 404 error when trying to load the wasm binary https://github.com/WebAssembly/spec/issues/1031 I'm guessing you don't have those webpack tasks as part of your pure JS project? You just need to copy the wasm file to the output of your pure JS project.
Unless you're producing a Kotlin/JS executable, you don't actually need those webpack tasks as part of your KMP library module. You only need it as part of your final executable/bundle
x
Copy code
sql-wasm.js:166 wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'.
yeah, i assumed this could be why in the original thread here
i see
is there any sample apps that i can look at where this is done one a pure js project?
d
This is a similar setup to yours, a KMP module being linked into a plain TypeScript project: https://github.com/cuhacking/atlas/tree/master/web
🙌 1
x
awesome - thank you very much 🙏
👍 1
it worked! so happy 😄
K 1
btw turns out
copy-webpack-plugin
required webpack >v5
ended up using
npm i copy-webpack-plugin@6
as mentioned here
h
Can you provide your code? I am stuck too:D
x
Well the project i’m working on isn’t open-source. But i’ll share just my webpack configs. I’m using
react-app-rewired
to override webpack configs from
create-react-app
Copy code
// config-overrides.js
const CopyWebpackPlugin = require("copy-webpack-plugin");

module.exports = function override(config, dev) {
    config.plugins.push(
        new CopyWebpackPlugin({
            patterns: [{from: "./node_modules/sql.js/dist/sql-wasm.wasm"}],
        }),
    )
    return config;
}
on kotlin side - no additional fancy configs are required (as i’m not directly serving from kotlin, rather packing from kotlin using
npm-publish
, and serving from js project
Copy code
val jsMain by getting {
  dependencies {
    implementation(npm(Npm.sqlJs, Npm.Versions.sqlJs))
  }
}
h
Thanks, got it 🙂
108 Views