HTML Include Plugin for Vite

html-include-plugin-vite.js

/*
 * Tiny HTML include plugin for Vite.
 * Usage: `<include src="./partials/header.html"></include>`
 */

import fs from 'fs'
import path from 'path'

function processIncludes(html, dir) {
  return html.replaceAll(/<include src="(.+?)"><\/include>/g, (_match, src) => {
    const filePath = path.resolve(dir, src)
    const content = fs.readFileSync(filePath, 'utf-8')
    return processIncludes(content, path.dirname(filePath))
  })
}

export default {
  name: 'html-include',
  transformIndexHtml(html, ctx) {
    return processIncludes(html, path.dirname(ctx.filename))
  }
}