You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I’m trying to write a custom Vite plugin for SvelteKit that modifies HTML when running npm run dev — basically to inject some scripts and metadata automatically.
The problem is: Vite never seems to detect or pass app.html through the plugin system. I’ve tried using transform(), transformIndexHtml(), and other plugin hooks. The plugin triggers just fine for .svelte files and even for CSS like app.css, but app.html is not getting passed.
My vite.config.ts setup:
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import htmlPlugin from './src/lib/myVitePlugin'; // testing my custom plugin
export default defineConfig({
plugins: [htmlPlugin(), sveltekit()]
});
I expected transformIndexHtml or any other vite hook to catch app.html the way it does with index.html or any other .svelte files normally. But nothing happens — it seems like SvelteKit bypasses that path completely.
So my questions:
Is app.html intentionally skipped from Vite’s HTML transform pipeline?
If so, what’s the “right” way to programmatically inject global scripts/metadata in dev? I ddon't want the user to directly make changes in app.html and commit to it.
Would appreciate any clarity on this, and what the recommended approach is if I want to achieve it.
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
Uh oh!
There was an error while loading. Please reload this page.
-
I’m trying to write a custom Vite plugin for SvelteKit that modifies HTML when running
npm run dev
— basically to inject some scripts and metadata automatically.The problem is: Vite never seems to detect or pass
app.html
through the plugin system. I’ve tried usingtransform()
,transformIndexHtml()
, and other plugin hooks. The plugin triggers just fine for.svelte
files and even for CSS likeapp.css
, butapp.html
is not getting passed.My
vite.config.ts
setup:I expected
transformIndexHtml
or any other vite hook to catchapp.html
the way it does withindex.html
or any other.svelte
files normally. But nothing happens — it seems like SvelteKit bypasses that path completely.So my questions:
app.html
and commit to it.Would appreciate any clarity on this, and what the recommended approach is if I want to achieve it.
Beta Was this translation helpful? Give feedback.
All reactions