diff --git a/packages/astro/src/index.ts b/packages/astro/src/index.ts index 619e248d4c..c2d2370d24 100644 --- a/packages/astro/src/index.ts +++ b/packages/astro/src/index.ts @@ -4,6 +4,40 @@ import type { AstroIntegration } from 'astro' import type { VitePluginConfig } from '@unocss/vite' import VitePlugin from '@unocss/vite' import type { UserConfigDefaults } from '@unocss/core' +import type { Plugin } from 'vite' + +const UNO_INJECT_ID = 'uno-astro' +const UNO_QUERY_KEY = 'uno-with-astro-key' + +interface AstroVitePluginOptions { + injects: string[] +} + +function AstroVitePlugin(options: AstroVitePluginOptions): Plugin { + const { injects } = options + return { + name: 'unocss:astro', + apply: 'serve', + enforce: 'pre', + resolveId(id, importer) { + if (id === UNO_INJECT_ID) + return id + if (importer?.endsWith(UNO_INJECT_ID)) + return `${id}${id.includes('?') ? '&' : '?'}${UNO_QUERY_KEY}` + }, + load(id, options) { + if (id.endsWith(UNO_INJECT_ID)) + return injects.join('\n') + + if ( + !options?.ssr + && id.includes(UNO_QUERY_KEY) + && id.includes('.css') + ) + return '' + }, + } +} export interface AstroIntegrationConfig extends VitePluginConfig { /** @@ -39,15 +73,12 @@ export default function UnoCSSAstroIntegration( return { name: 'unocss', hooks: { - 'astro:config:setup': async ({ config, injectScript }) => { + 'astro:config:setup': async ({ config, updateConfig, injectScript }) => { // Adding components to UnoCSS's extra content options.extraContent ||= {} options.extraContent.filesystem ||= [] options.extraContent.filesystem.push(resolve(fileURLToPath(config.srcDir), 'components/**/*').replace(/\\/g, '/')) - config.vite.plugins ||= [] - config.vite.plugins.push(...VitePlugin(options, defaults) as any) - const injects: string[] = [] if (injectReset) { const resetPath = typeof injectReset === 'string' @@ -62,8 +93,17 @@ export default function UnoCSSAstroIntegration( } if (injectExtra.length > 0) injects.push(...injectExtra) + + updateConfig({ + vite: { + plugins: [AstroVitePlugin({ + injects, + }), ...VitePlugin(options, defaults)], + }, + }) + if (injects?.length) - injectScript('page-ssr', injects.join('\n')) + injectScript('page-ssr', `import ${JSON.stringify(UNO_INJECT_ID)}`) }, }, }