fix(nuxt): inline global css with ssr: false route rule (#21763)

This commit is contained in:
Daniel Roe 2023-06-25 22:50:42 +01:00 committed by GitHub
parent 5b8370414a
commit 4cc9a7135d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 1 deletions

View File

@ -126,6 +126,7 @@ const getSPARenderer = lazyCachedFunction(async () => {
const renderToString = (ssrContext: NuxtSSRContext) => { const renderToString = (ssrContext: NuxtSSRContext) => {
const config = useRuntimeConfig() const config = useRuntimeConfig()
ssrContext.modules = ssrContext.modules || new Set<string>()
ssrContext!.payload = { ssrContext!.payload = {
_errors: {}, _errors: {},
serverRendered: false, serverRendered: false,

View File

@ -1169,6 +1169,17 @@ describe.skipIf(isDev() || isWebpack)('inlining component styles', () => {
} }
}) })
it('should inline global css when accessing a page with `ssr: false` override via route rules', async () => {
const globalCSS = [
'{--plugin:"plugin"}', // CSS imported ambiently in JS/TS
'{--global:"global";' // global css from nuxt.config
]
const html = await $fetch('/route-rules/spa')
for (const style of globalCSS) {
expect(html).toContain(style)
}
})
it('should not include inlined CSS in generated CSS file', async () => { it('should not include inlined CSS in generated CSS file', async () => {
const html: string = await $fetch('/styles') const html: string = await $fetch('/styles')
const cssFiles = new Set([...html.matchAll(/<link [^>]*href="([^"]*\.css)">/g)].map(m => m[1])) const cssFiles = new Set([...html.matchAll(/<link [^>]*href="([^"]*\.css)">/g)].map(m => m[1]))

View File

@ -35,7 +35,7 @@ describe.skipIf(process.env.SKIP_BUNDLE_SIZE === 'true' || process.env.ECOSYSTEM
it('default server bundle size', async () => { it('default server bundle size', async () => {
stats.server = await analyzeSizes(['**/*.mjs', '!node_modules'], serverDir) stats.server = await analyzeSizes(['**/*.mjs', '!node_modules'], serverDir)
expect.soft(roundToKilobytes(stats.server.totalBytes)).toMatchInlineSnapshot('"63.9k"') expect.soft(roundToKilobytes(stats.server.totalBytes)).toMatchInlineSnapshot('"64.0k"')
const modules = await analyzeSizes('node_modules/**/*', serverDir) const modules = await analyzeSizes('node_modules/**/*', serverDir)
expect.soft(roundToKilobytes(modules.totalBytes)).toMatchInlineSnapshot('"2328k"') expect.soft(roundToKilobytes(modules.totalBytes)).toMatchInlineSnapshot('"2328k"')