Problem I'm trying to solve:
I want to have one file with exports, info.js, that are variables including markup or pure strings.
For example;
export const title = "Some title"
export const mainText = (<b> I'm so texty </b>, mark me up like I'm a hot reloadable)
In JSX world, mainText is fine, in Svelte world, mainText needs to be a string which I then load with the @html thingy {@html mainText}.
Semi solution with issue I'd like input on:
Although, when I load with @html, the styles within the .svelte file are not applied. Fine, I can do that with :global, but... my second issue is that markup in a string is annoying too - can't prettify it.
What should I be doing?
Create a separate file for html-like syntax, markup in a string won't be very pretty, not much to do about it. You can load and parse .html from the back-end or something, but it's not the best thing as well.
Styles should be global, because it's not intended to work in this way (scoping out of box), but you can have your separate styles file as well in the static folder or send from the back-end with html as a separate and independent page.
Generally, I'd advise to refactor everything, so you can use Svelte as it's supposed to be used.