Can Cherry or Squint support js like output for Astro?

[shivekkhurana]

I have been following squint and cherry for a while. In the js land, I have also been looking at the meteoric rise of Astro.
The promise of Astro is 0 kb JS bundle, if you don't need interactivity. It can also mixin frameworks.

The only catch is, that you need to write .astro files, also called Astro Components.

Astro components are JSX like, but they add frontmatter to code:

---
import Button from './Button.astro';
---
<div>
  <Button title="Button 1" />
  <Button title="Button 2" />
  <Button title="Button 3" />
</div>

The --- seems painful, only if it could be an astroImport([comp1Path, comp2Path]), and normal js files, squint can be used directly.

Does squint or cherry has a hook (or a planned hook) to transform output ? That can help add these pesky separators ---.

Thanks

[borkdude]

I don't know exactly how astro works, but maybe you could possibly already do this using js*?

(js* "---
import Button from './Button.astro';
---")
#jsx [:div ...]

[shivekkhurana]

Thanks for the quick reply, I'll check this out and report back. Will write a blog post when I get it to work.

[martinklepsch]

I think instead of making cherry output .astro files the right approach here would be to import from .cljs/cherry files.

Cherry is just a producer of ES modules.

---
import Button from './Button.cljs';
---
<div>
  <Button title="Button 1" />
  <Button title="Button 2" />
  <Button title="Button 3" />
</div>