import type { Plugin } from 'vite'; /** * This plugin is a workaround to inject some styles into the `` of the iframe to * prevent the "no story" text from appearing breifly while the page loads in. * * It can be removed, and these styles placed back into the head, * when https://github.com/vitejs/vite/issues/6737 is closed. */ export function noFouc(): Plugin { return { name: 'no-fouc', enforce: 'post', async transformIndexHtml(html, ctx) { if (ctx.path !== '/iframe.html') { return; } return insertHeadStyles(html); }, }; } /** * Insert default styles to hide storybook elements as the page loads until JS can * add the official storybook default head styles and scripts. These lines are mostly * taken from https://github.com/storybookjs/storybook/blob/next/lib/core-common/templates/base-preview-head.html#L6-L20 */ function insertHeadStyles(html: string) { return html.replace( '', ` `.trim() ); }