ElMassimo / iles

🏝 The joyful site generator
https://iles.pages.dev
MIT License
1.07k stars 31 forks source link

Ability to customise base HTML `index.html` #136

Open dhruvkb opened 2 years ago

dhruvkb commented 2 years ago

Is your feature request related to a problem? Please describe. I want to use an HTML snippet at the top of each of the output pages. In my cases, it's just some ASCII art (not super important) but I could see people wanting to place more useful things there. Currently I cannot add that because iles hides the underlying HTML.

Describe the solution you'd like Since iles abstracts the base HTML, I cannot do so. Would it be feasible to replace the base HTML with a custom one that uses a slot where iles can inject its output code?

Describe alternatives you've considered I'm looking for ways to use Vue to inject some text into the HTML. But I might just abandon it and not add the snippet at all.

ElMassimo commented 2 years ago

Hi Dhruv!

This is an enhancement that I've been wanting to add for a while now, as it would also make it easier to leverage any Vite plugins that rely on transformIndexHtml.


Regarding your use case, it's possible to inject anything you want using Vue but it will always be inside of the body.

If the ASCII is intended to be an HTML comment, you could use createCommentVNode from vue and render that in your layouts:

<script setup lang="ts">
import { createCommentVNode } from 'vue'
import asciiArtText from '~/ascii-art.txt?raw'

const AsciiArt = createCommentVNode(asciiArtText)
</script>

<template>
  <AsciiArt/>
</template>