How to make Remix 2 work with @react-three/fiber?

[ozitrance]

Been looking around for a working example but couldn't find anything that uses remix 2. All the ones I found were for older versions and include patches for the libraries. Is it possible to make it work with remix 2?

Any help would be highly appreciated

[joevingracien]

Everything seems fine to me, what problem are you facing ?

Here is a simple example following the introduction from R3F website.

https://github.com/joevingracien/remixreactthreefiber

[ozitrance]

Thank you so much for your help! Your example works! I'm new to remix and couldn't find an example anywhere, might be a good idea to add this to the Remix examples repository https://github.com/remix-run/examples :)

I'm still having problems building on this, integrating a new library (https://spline.design/) which makes it really simple to design 3d. It converts the code to react three fiber ( or react component ) and provides you with a file containing the materials and geometries for the whatever you create.

Seems like loading that file gives the errors.

I tried both ways and I keep getting errors. If I add the new code while the server is running I get this error:

FetchError [ERR_NO_HANDLER]: No fetch handler defined and no upstream to proxy to specified.
Make sure you're exporting a default object containing a `fetch` function property.
    at ServiceWorkerGlobalScope.[kDispatchFetch] (C:\rmx\shopify\node_modules\@miniflare\core\src\standards\event.ts:431:15)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)

If I restart the server and try again I get this error:

EvalError: Code generation from strings disallowed for this context
    at new Function (<anonymous>)
    at Qe (C:\rmx\shopify\node_modules\@splinetool\loader\build\SplineLoader.js:15:2947)
    at C:\rmx\shopify\node_modules\@splinetool\loader\build\SplineLoader.js:15:3244
    at C:\rmx\shopify\node_modules\@splinetool\loader\build\SplineLoader.js:15:3652
    at Ha (C:\rmx\shopify\node_modules\@splinetool\loader\build\SplineLoader.js:1:300)
    at C:\rmx\shopify\node_modules\@splinetool\loader\build\SplineLoader.js:2607:18850
    at SourceTextModule.evaluate (node:internal/vm/module:228:23)
    at VMScriptRunner.runAsModule (C:\rmx\shopify\node_modules\@miniflare\runner-vm\src\index.ts:40:18)
    at VMScriptRunner.run (C:\rmx\shopify\node_modules\@miniflare\runner-vm\src\index.ts:86:17)
    at MiniOxygen.#reload (C:\rmx\shopify\node_modules\@miniflare\core\src\index.ts:793:13)

Any idea on how to fix that ..?

[ozitrance]

Apparently it only happens in the Shopify/Hydrogen Build... Any ideas why only there?

I'll try to get help from Shopify.

Thank you for you help

[jnhamid]

@ozitrance did you ever find away around this?