feat(nuxt): enable `renderSSRHeadOptions` configuration for `unhead` #26989

Mini-ghost · 2024-04-29T10:08:32Z

🔗 Linked issue

📚 Description

This PR support configure renderSSRHeadOptions of unhead to help us adjust the output of head tags, such as get more compact HTML result.

export default defineNuxtConfig({
  features: {
    omitLineBreaks: true
  }
})

In production environment , when meta.renderSSRHeadOptions.omitLineBreaks is false:

<!DOCTYPE html><html><head><meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="modulepreload" as="script" crossorigin href="/_nuxt/Cc_1Avt4.js">
<link rel="prefetch" as="script" crossorigin href="/_nuxt/CW1WwFCW.js">
<link rel="prefetch" as="script" crossorigin href="/_nuxt/BbxhR_VA.js">
<link rel="prefetch" as="script" crossorigin href="/_nuxt/Cz_w0jng.js">
<script type="module" src="/_nuxt/Cc_1Avt4.js" crossorigin></script></head>

In production environment , when meta.renderSSRHeadOptions.omitLineBreaks is undefined or true:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="modulepreload" as="script" crossorigin href="/_nuxt/Bzb4FGiR.js"><link rel="prefetch" as="script" crossorigin href="/_nuxt/CX8zz9fU.js"><link rel="prefetch" as="script" crossorigin href="/_nuxt/bk47NN6-.js"><link rel="prefetch" as="script" crossorigin href="/_nuxt/ImDE-rvC.js"><script type="module" src="/_nuxt/Bzb4FGiR.js" crossorigin></script></head>

stackblitz · 2024-04-29T10:08:36Z

Run & review this pull request in StackBlitz Codeflow.

docs/2.guide/3.going-further/1.features.md

danielroe · 2024-04-29T12:32:01Z

I'm wondering about the best location for this (and possibly other options) for the head - maybe instead in head or in app.head. I'm worried this will clutter features. What do you think @harlan-zw?

harlan-zw · 2024-04-29T12:54:56Z

If a features Nuxt line break config was going to be added it should handle the line breaks for the entire document, not just the head so I'd say this isn't the right place for it.

Having a way to pass options to the Unhead functions would be the most future proof and it would make sense for that config to exist within the head modules config that is under the meta key. (although we should probably rename this to head or unhead for v4)

export default defineNuxtConfig({
  meta: {
    renderSSRHead: { // typeof RenderSSRHeadOptions @unhead/schema
      ssrOmitLineBreaks: true,
    }
  }
})

I don't really see a reason why this can't be enabled by default in a production environment for v4 either 🤔 Could also be the default of Unhead v2 if I have time to get to this before v4

Mini-ghost · 2024-04-29T16:37:59Z

I am currently following the conclusions of unjs/unhead#297 and have set omitLineBreaks to be disabled by default. However, I think it would be great if omitLineBreaks could be enabled by default in the production environment!

Also, concerning the type of meta.renderSSRHead, if it is expected to align with the RenderSSRHeadOptions from @unhead/schema, perhaps we could structure the configuration as follows to ensure consistency. Additionally, would it be more appropriate to use renderSSRHeadOptions instead of renderSSRHead?

export default defineNuxtConfig({
  meta: {
    renderSSRHeadOptions: { // typeof RenderSSRHeadOptions @unhead/schema
      omitLineBreaks: true,
    }
  }
})

Moreover, as we anticipate the name will change to head or unhead in v4, could we consider adopting this naming convention in v3 to maintain continuity?

danielroe · 2024-04-29T18:41:15Z

I don't think either meta or head currently exists in the Nuxt config options, so I think we're good to add a new key without any issues (though head would conflict with Nuxt 2 types - so it might create issues for module that support both Nuxt 2/Bridge and Nuxt 3+ 🤔)...

Mini-ghost · 2024-04-30T02:42:09Z

It appears that our decision to use meta as the key in v3 might be a more suitable choice.

Additionally, should we set the schema part in schema/src/config/app.ts?

This reverts commit 602ed0b.

This reverts commit 6ca5905. # Conflicts: # packages/nuxt/src/core/runtime/nitro/renderer.ts

Mini-ghost · 2024-05-02T02:56:37Z

packages/schema/src/config/app.ts

+
+ meta: {
+ /**
+ * An object that will be passed to `renderSSRHead` to customize the output.
+ *
+ * @see https://unhead.unjs.io/setup/ssr/installation#options
+ * @type {typeof import('@unhead/schema').RenderSSRHeadOptions}
+ */
+ renderSSRHeadOptions: undefined,
+ },


Comments here will automatically generate documentation. I want to know how to write better?

danielroe · 2024-05-02T09:35:47Z

I wonder about using unhead rather than head or meta. It would match vite, postcss, etc...

Mini-ghost · 2024-05-02T10:21:24Z

I didn’t put much thought into the name initially, but now that I’ve thought it over, unhead actually sounds like a better choice. It clearly points out where our dependencies come from and helps us avoid any mix-ups.

nuxt/packages/schema/src/config/app.ts

Lines 108 to 110 in 572c367

 head: { 

 $resolve: async (val: Partial<AppHeadMetaObject> | undefined, get) => { 

 const resolved = defu(val, await get('meta') as Partial<AppHeadMetaObject>, {

Should we change it to unhead then?

danielroe · 2024-05-02T12:12:48Z

I think likely, though I'd love feedback from @pi0 and @harlan-zw particularly. 🙏

The bit in schema is an (untyped) backwards-compatible bit. We'd likely need to keep the backwards-compatibility, but people really shouldn't be using it at this point.

danielroe · 2024-05-03T10:00:30Z

We've decided to add unhead key to schema that allows configuring the unhead nuxt module directly, which will unblock configuration of advanced use cases (linking #27031 for headNext support). Would you be happy to update this PR? 🙏

packages/nuxt/src/head/module.ts

danielroe

Perfect! Though will wait for @harlan-zw's thoughts on API. 🙏

packages/nuxt/src/head/module.ts

harlan-zw · 2024-05-06T13:37:39Z

Looks good minus the comment. I'm guessing this will land in v3.12 so probably we want to minimise any new behaviour until v4.

…gure-omitLineBreaks

Mini-ghost added 2 commits April 29, 2024 17:30

feat(nuxt): enable omitLineBreaks configuration for @unhead

6ca5905

docs: update documentation

602ed0b

github-actions bot added 3.x enhancement labels Apr 29, 2024

xjccc reviewed Apr 29, 2024

View reviewed changes

docs/2.guide/3.going-further/1.features.md Outdated Show resolved Hide resolved

Mini-ghost marked this pull request as draft April 29, 2024 23:10

Mini-ghost added 4 commits April 30, 2024 10:46

Merge branch 'main' into feature/support-configure-omitLineBreaks

93e9559

feat(nuxt): enable renderSSRHeadOptions configuration for unhead

a8e9a67

Revert "docs: update documentation"

d4e652d

This reverts commit 602ed0b.

Revert "feat(nuxt): enable omitLineBreaks configuration for @unhead"

36c1b73

This reverts commit 6ca5905. # Conflicts: # packages/nuxt/src/core/runtime/nitro/renderer.ts

Mini-ghost marked this pull request as ready for review May 1, 2024 14:33

Mini-ghost changed the title ~~feat(nuxt): enable omitLineBreaks configuration for @unhead~~ feat(nuxt): enable renderSSRHeadOptions configuration for unhead May 1, 2024

feat(nuxt): use defu to merge default options

d60db7e

Mini-ghost commented May 2, 2024

View reviewed changes

Mini-ghost added 2 commits May 3, 2024 18:26

refactor(nuxt): use unhead as key instead of meta

e81089f

docs: add more detail to the docs

026469c

danielroe requested a review from harlan-zw May 3, 2024 10:28

danielroe reviewed May 3, 2024

View reviewed changes

packages/nuxt/src/head/module.ts Outdated Show resolved Hide resolved

refactor(nuxt): use defaults function pre-merged options

a8ef010

danielroe approved these changes May 3, 2024

View reviewed changes

Merge branch 'main' into feature/support-configure-omitLineBreaks

3232872

harlan-zw reviewed May 6, 2024

View reviewed changes

packages/nuxt/src/head/module.ts Outdated Show resolved Hide resolved

Mini-ghost and others added 8 commits May 6, 2024 22:34

feat(nuxt): set default value of omitLineBreaks to false

14863f5

fix: set omitLineBreaks to true by default in v4 compatibility mode

8170dd3

fix(nuxt): treat schema as source of truth

75583e3

Merge remote-tracking branch 'origin/main' into feature/support-confi…

99664a9

…gure-omitLineBreaks

docs: add defineNuxtConfig wrapper

096137f

chore: remove config key

48fffa3

chore: provide backwards-compatible default

a6bcd49

docs: add explanation of how to disable

4550d21

danielroe merged commit 9e8261a into nuxt:main May 7, 2024
58 checks passed

github-actions bot mentioned this pull request May 7, 2024

v3.12.0 #26703

Draft

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(nuxt): enable `renderSSRHeadOptions` configuration for `unhead` #26989

feat(nuxt): enable `renderSSRHeadOptions` configuration for `unhead` #26989

Mini-ghost commented Apr 29, 2024 •

edited

stackblitz bot commented Apr 29, 2024

danielroe commented Apr 29, 2024

harlan-zw commented Apr 29, 2024 •

edited

Mini-ghost commented Apr 29, 2024

danielroe commented Apr 29, 2024

Mini-ghost commented Apr 30, 2024

Mini-ghost May 2, 2024

danielroe commented May 2, 2024

Mini-ghost commented May 2, 2024

danielroe commented May 2, 2024 •

edited

danielroe commented May 3, 2024

danielroe left a comment

harlan-zw commented May 6, 2024

feat(nuxt): enable renderSSRHeadOptions configuration for unhead #26989

feat(nuxt): enable renderSSRHeadOptions configuration for unhead #26989

Conversation

Mini-ghost commented Apr 29, 2024 • edited

🔗 Linked issue

📚 Description

stackblitz bot commented Apr 29, 2024

danielroe commented Apr 29, 2024

harlan-zw commented Apr 29, 2024 • edited

Mini-ghost commented Apr 29, 2024

danielroe commented Apr 29, 2024

Mini-ghost commented Apr 30, 2024

Mini-ghost May 2, 2024

Choose a reason for hiding this comment

danielroe commented May 2, 2024

Mini-ghost commented May 2, 2024

danielroe commented May 2, 2024 • edited

danielroe commented May 3, 2024

danielroe left a comment

Choose a reason for hiding this comment

harlan-zw commented May 6, 2024

feat(nuxt): enable `renderSSRHeadOptions` configuration for `unhead` #26989

feat(nuxt): enable `renderSSRHeadOptions` configuration for `unhead` #26989

Mini-ghost commented Apr 29, 2024 •

edited

harlan-zw commented Apr 29, 2024 •

edited

danielroe commented May 2, 2024 •

edited