Is there a dotnet template for Oxpecker/Solid?

[NatElkins]

I see that the Solid/Oxpecker template is here: https://github.com/Lanayx/Oxpecker/tree/main/examples/EmptySolid

Is there a dotnet template for it? And if not, what is the recommended way of getting it locally on my machine? Checking out the repo, then copying that one directory? Or is there some other one-liner you've been using?

Thank you!

[Lanayx]

Yes, checking the repo, going to main branch and copying that one directory is the way to go.

For a more "complete" solution you might want to check CRUD example or TODO example , which include several components and Tailwind.

[NatElkins]

Would you take a PR that adds a dotnet new template?

https://learn.microsoft.com/en-us/dotnet/core/tools/custom-templates

[Lanayx]

Yes, I'll accept that PR. Keeping it up to date will cause certain pain, but I believe this could simplify adoption. If you plan to work on it, please create a templates folder in the root where we'll be able to put different templates: for frontend, for backend, maybe even for fullstack project structure as well as htmx.

[NatElkins]

I started to look into this, it seems like somehow the file watching/reloading is broken in the EmptySolid example? I built everything, and then went into the EmptySolid folder, then ran npm start. I then tried making changes to the "Hello world!". It maybe works on one or two updates, but if you keep adding !, it seems to stop updating after a while. At least on my computer, it gets stuck here:

Watching ../..
7:18:01 PM [vite] hmr update /src/App.jsx
Started Fable compilation...

Are you able to repro? I'm on an M3 Mac. I figure this should get fixed before I turn the example into a template.

[Lanayx]

@NatElkins I've poked around it a bit and found that HMR works well until the first compilation error. Then it doesn't work until page refresh and then it starts working again. Have you seen such behavior with other Fable projects? (I'm on Windows)

UPDATE: I've just tried empty Fable template and it looks like HMR works better there - on error it shows empty screen, but after error is fixed, it's restored. I'll take a deeper look tomorrow

[Lanayx]

I've taken a look and it looks it's not directly relevant to Oxpecker.Solid or even Fable. When we start, the jsx looks like that:

export function App() {
    return <h1>
        Hello world!!
    </h1>;
}

On compilation error the content changes to

export function App() {
    throw 1;
}

This change breaks HMR even if you only touch jsx file and don't touch any F# files. @MangelMaxime do you have any ideas how to improve it? Maybe not changing jsx file at all in case of error instead of generating throw 1?

[MangelMaxime]

Maybe not changing jsx file at all in case of error instead of generating throw 1?

The issue is that even if we try to not change a generated file when the generation fails, it could still result in a runtime error which could perhaps break HMR?

If the issue is only with JSX perhaps plugins generating JSX should try to capture when Fable generate throw 1 and generate a JSX equivalent or dummy value like <div>Compilation failed</div>.

If the issue is with the exception breaking HMR. Also, I don't remember Elmish having trouble to restore a failed state from HRM so perhaps there is something to explore in how the state is restored even if I suppose here it is all handled internal by Solid.js versus Elmish having its own state handler.

[Lanayx]

@MangelMaxime Thank you so much for you input

If the issue is only with JSX perhaps plugins generating JSX should try to capture when Fable generate throw 1 and generate a JSX equivalent or dummy value like <div>Compilation failed</div>.

I've implemented this in 0.4.1 and it works on simple cases.

@NatElkins Can you please try it now?