Closed kristiandupont closed 1 year ago
Update: It seems to work if I add this to the vite config: esbuild: { jsxDev: false}
. I am not sure if it means that I lose some debuggability or something? I will close this for now.
Hi Kristian,
I'm not using typescript in my applications, but I have crankjs working with vite with only the following config being necessary:
vite.config.js
export default {
esbuild: {
jsxFactory: 'createElement',
jsxFragment: 'Fragment'
}
}
Happy to discuss.
Ngā mihi, regards, Darryl
Hi Kristian,
Maybe a bit more infomation would be helpful.
vite.config.js
export default {
esbuild: {
jsxFactory: 'createElement',
jsxFragment: 'Fragment'
}
};
index.html
<html>
...
<div id="app"></div>
<script type="module" src="/index.jsx"></script>
...
</html
index.jsx
import { createElement, Fragment } from "@b9g/crank";
import { renderer } from "@b9g/crank/dom";
document.addEventListener("DOMContentLoaded", async () => {
await renderer.render(
<div>Hello world</div>, // or a crank component
document.querySelector("#app")
);
});
Hope that helps, should just work :-) Darryl
Thanks Darryl, I got it working with what I wrote above so I am sticking with that for now. :-) Excited about trying this out. It seems that traction is still slow and I do feel that there is a real chance we all discover some serious downsides to the approach but it feels like a principle that needs to be tried out properly.
Cheers. Go well.
Sincere regards, Ddarryl
Sorry about the tardy response. Thank you @darrylcousins for stepping in!
I also apologize about the traction. @kristiandupont let me know your thoughts. Thank you for checking out Crank.js
No worries, I maintain open source projects myself and I am not always available.
I am experimenting with it and it's definitely hard to un-React my brain but it feels very powerful and "pure" for the lack of a better word. The one thing that is hard for me to imagine is a SSR/client transition as it feels like it would require arbitrary jumps. But I can see that you are discussing that heavily already :-)
I'm trying this out. I like Vite so I would like it to work with that.
These are my configs:
tsconfig.json
:vite.config.ts
:I have a simple file from the getting started section:
But when I load my page, I get the following error in the console:
It looks like the module it's importing from only exports a
jsx
item, but nojsxDEV
. I am not sure if this is related to Vite (/ESBuild)?