redbadger / crux

Cross-platform app development in Rust
https://redbadger.github.io/crux/
Apache License 2.0
1.68k stars 58 forks source link

Add an example using vite as a JS/TS build tool #172

Open nmrshll opened 8 months ago

nmrshll commented 8 months ago

For a few reasons it was a bit harder than expected adapting the examples to work with Vite (+solid-js): I hit a few problems which weren't obvious to troubleshoot.

I'm planning on adding a web target to the counter example, using Vite and SolidJs.

charypar commented 8 months ago

Thanks for this!

For posterity, would you mind elaborating on the issues you hit, in case some other frameworks face similar problems?

nmrshll commented 7 months ago

Ah sorry I had missed your message, and I've since then forgotten the details of the problems I ran into.

From vague memory, I had two problems, with the javascript tooling stack rather than the code itself:

  1. in the package.json dependencies, using link:... for the shared libraries didn't work for some reason (the wasm would fail loading at runtime in the browser). Using file:... instead worked:

    "shared": "file:../shared/pkg",
    "shared_types": "file:../shared_types/generated/typescript",
  2. In the vite.config.ts file (default file provided with the official solidjs/vite template), I needed to explicitly tell vite to not optimize the shared wasm dependency:

    export default defineConfig({
    plugins: [solid()],
    optimizeDeps: {
    exclude: ["shared"],
    },
    });

    Otherwise, if I remember right, the wasm would have missing symbols when called at runtime.