svelte - generate a single static html

[apreb]

Hi Mair, first of all congratulations for the excellent ESP32 course!

I've been following the website development section and i am amazed on the svelte setup on your lectures. According to your instructions the web page content is generated as a collection of static files that are then linked to SPIFFS filesystem. It works really great.

I would like to know if its possible to, go a step further and generate the full web content as a single html file, where i could then compress and embed on the project the same way i do with certificates. The bigger advantage is that every OTA update will include the web page too. I currently use this approach but i lack the frontend dev setup so my web page ends up not being very sophisticated and difficult to manage.

Hope it makes sense,

Best regards,
Antonio

[Mair]

Hi @apreb,

Thanks you :)
That's a good question.
It is possible to create a single file but it adds a lot of complexity to the web development. tools like SveltKit or vite ( Vite is really worth checking out by the way). These tools use a bundler to create all the final assets. They use technologies like rollup or webpack. These tools use these tools underneath the covers. It is possible to "eject" this and then configure these bundling tools differently.
Its worth noting that these tools split the bundle up for performance reasons.
I would propose a slightly different approach. you can

1. build the project like you normally do. If you look in the build folder you will find the bin file that contains your SPIFFS (You can also use the spiffsgen tool as described here
   

2. host that bin file on a http server

3. on your esp32 create an endpoint to retrieve it

4. use the partitions API to write the bin file straight into the flash partition. This is how OTA works under the hood

[apreb]

Hi Mair,

I used that strategy before, with 2xOTA updates, one for the firmware and another for SPIFFS, and it was not the best experience, so i evolved to a full binary bundle with singe OTA app, and was planning to get rid of spiffs, but i guess it's reasonable to go back just to get that frontend dev integrated.

Thanks!