Format javascript template strings tagged as solidity

[fvictorio]

This is more of an idea/research task than something we necessarily need to do, but I've run into this a couple of times already.

It's very common to have a string in javascript that contains code:

const htmlCode = `
<div>
  <p>Lorem ipsum etc.</p>
</div>
`;

Prettier does something interesting: if the string uses a tag named html, it will format the contents of the string. I hoped that that would extend to any languages, and that using a no-op solidity tag would result in the Solidity code being formatted, but that's not the case: the supported languages are hardcoded (see here).

There is a prettier-plugin-embed plugin that lets you configure that, but I'm not sure I want to use it: it's unclear if it's maintained, and my impression is that it sort-of monkey patches prettier to add a feature that should be built-in.

So I wonder if there's a decent way to add support for that in Prettier Solidity itself. My instinct is that there's not, and that we would fall back to doing something similar to what prettier-plugin-embed does. But I think it's worth investigating.

I think the prettier team is aware of the general issue of embedded languages. There's this 3-year old proposal and an area:multiparser tag, but I don't know if this will be improved in the foreseeable future.