Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-15 02:14:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(nuxt): add crossorigin attribute for stylesheets (#29138)

Browse Source
This commit is contained in:
Daniel Roe 2024-09-24 13:03:09 +01:00 committed by GitHub
parent 1e236a4b3b
commit f825eb54c4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/nuxt/src/core/runtime/nitro/renderer.ts
View File

@ -385,7 +385,7 @@ export default defineRenderHandler(async (event): Promise<Partial<RenderResponse
link: [ link: [
process.env.NUXT_JSON_PAYLOADS process.env.NUXT_JSON_PAYLOADS
? { rel: 'preload', as: 'fetch', crossorigin: 'anonymous', href: payloadURL } ? { rel: 'preload', as: 'fetch', crossorigin: 'anonymous', href: payloadURL }
: { rel: 'modulepreload', href: payloadURL }, : { rel: 'modulepreload', crossorigin: '', href: payloadURL },
], ],
}, headEntryOptions) }, headEntryOptions)
} }
@ -406,7 +406,7 @@ export default defineRenderHandler(async (event): Promise<Partial<RenderResponse
// - in dev mode when not rendering an island // - in dev mode when not rendering an island
// - in dev mode when rendering an island and the file has scoped styles and is not a page // - in dev mode when rendering an island and the file has scoped styles and is not a page
if (!import.meta.dev || !isRenderingIsland || (resource.file.includes('scoped') && !resource.file.includes('pages/'))) { if (!import.meta.dev || !isRenderingIsland || (resource.file.includes('scoped') && !resource.file.includes('pages/'))) {
link.push({ rel: 'stylesheet', href: renderer.rendererContext.buildAssetsURL(resource.file) }) link.push({ rel: 'stylesheet', href: renderer.rendererContext.buildAssetsURL(resource.file), crossorigin: '' })
} }
} }
if (link.length) { if (link.length) {

9
test/basic.test.ts
View File

@ -1810,7 +1810,7 @@ describe.skipIf(isDev() || isWebpack)('inlining component styles', () => {
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<string>('/styles') const html: string = await $fetch<string>('/styles')
const cssFiles = new Set([...html.matchAll(/<link [^>]*href="([^"]*\.css)">/g)].map(m => m[1]!)) const cssFiles = new Set([...html.matchAll(/<link [^>]*href="([^"]*\.css)"(?: crossorigin)?>/g)].map(m => m[1]!))
let css = '' let css = ''
for (const file of cssFiles || []) { for (const file of cssFiles || []) {
css += await $fetch<string>(file) css += await $fetch<string>(file)
@ -1831,11 +1831,7 @@ describe.skipIf(isDev() || isWebpack)('inlining component styles', () => {
it('does not load stylesheet for page styles', async () => { it('does not load stylesheet for page styles', async () => {
const html: string = await $fetch<string>('/styles') const html: string = await $fetch<string>('/styles')
expect(html.match(/<link [^>]*href="[^"]*\.css">/g)?.filter(m => m.includes('entry'))?.map(m => m.replace(/\.[^.]*\.css/, '.css'))).toMatchInlineSnapshot(` expect(html.match(/<link [^>]*href="[^"]*\.css">(?: crossorigin)?/g)?.filter(m => m.includes('entry'))?.map(m => m.replace(/\.[^.]*\.css/, '.css'))).toMatchInlineSnapshot(`undefined`)
[
"<link rel="stylesheet" href="/_nuxt/entry.css">",
]
`)
}) })
it('still downloads client-only styles', async () => { it('still downloads client-only styles', async () => {
@ -2365,6 +2361,7 @@ describe('component islands', () => {
{ {
"link": [ "link": [
{ {
"crossorigin": "",
"href": "/_nuxt/components/islands/PureComponent.vue?vue&type=style&index=0&scoped=c0c0cf89&lang.css", "href": "/_nuxt/components/islands/PureComponent.vue?vue&type=style&index=0&scoped=c0c0cf89&lang.css",
"rel": "stylesheet", "rel": "stylesheet",
}, },