Solid Universal Renderer Support - Lightning

[chiefcll]

👋

I work on https://github.com/lightning-js/solid - Which uses the Universal Renderer for Solid. I'd like to get it working with the Playground:

import { render, Canvas, Text } from '@lightningjs/solid';

render(() => (
  <Canvas options={{ rootId: 'app' }}>
    <Text>Hello World</Text>
  </Canvas>
));

However it seems the playground is hard coded to use solid/web which I can't seem to remove. Figured I'd ask if this would be easy to support or if I'd need to host this separately and tweak the vite config?

Thanks for the help!

[milomg]

One trick that you might try is switching the import map to point solid-js/web at whatever package you intend (i'm also open to adding a way to configure the babel config, but this might be an easier first step). Then I believe you would need a precompiled version of your package that doesn't have JSX files.

[chiefcll]

I got the UI portion figured out and add a radio button for Universal build options. Now trying to figure out compiling JSX files.

1) Why do I need to precompile them? I assume the web compiler doesn't support JSX 2) Do you know the options to do this with Typescript? Have this now:

"jsx": "preserve",
"jsxImportSource": "solid-js",

I need to replace preserve and probably use jsxFactory setting. Any pointers?

[chiefcll]

Update:

I'm using rollup now to create a build: https://www.npmjs.com/package/rollup-preset-solid

So now I build esm + source in the dist which compiles out the JSX. I've setup main to point to the esm.

I'm having a lot of trouble with JSPM now. Here is my package, its still using the JSX for the import.
https://jspm.dev/@lightningjs/solid@0.6.6

JSPM is supposed to support the other exports but that doesn't seem to work - https://jspm.dev/@lightningjs/solid@0.6.6/browser

So I'm closer now - might just have to figure out JSPM bugs now.

[chiefcll]

OK - got this fully working. I'll be opening a PR to get universal support going soon. For anyone else wanting to do this with a library you can check out - https://github.com/lightning-js/solid

[chiefcll]

What do I need to do to get this merged and released? Willing to buy coffee + donuts... @modderme123

[milomg]

Sorry about the delay, just working through my backlog, should be out early next week

[chiefcll]

Awesome and thanks! I'm giving a talk next Friday on SolidJS and Universal Rendering - so good timing 👍

[milomg]

Thanks again the PR!