docs: standardize indentation and tag positioning

[shahabbasian]

🔗 Linked issue

❓ Type of change

• 📖 Documentation (updates to the documentation, readme or JSdoc annotations)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

I believe that newcomers tend to internalize the code patterns present in the documentation as they read it. This will indeed help them write clean code by following established patterns.

• The tag has been added to the code snippets in the "Class And Style Bindings" section of the documentation.
• Standardize indentation and tag positioning across all pages.
• All <script setup> changed to <script setup lang="ts">

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[nuxt-studio]

✅ Live Preview ready!

Name	Edit	Preview	Latest Commit
Nuxt Docs	Edit on Studio ↗︎	View Live Preview	7c8d5b5

[florian-lefebvre]

Awesome! Maybe we can also get rid of lang="ts" when not using ts features. Wdyt?

[shahabbasian]

Awesome! Maybe we can also get rid of lang="ts" when not using ts features. Wdyt?

I don't know if this is Nuxt team policy or if it's just a habit for the programmer to include lang="ts" for sections that are not using TypeScript.

If Nuxt team approves, I'm also willing to fix this issue.

[florian-lefebvre]

Cc @danielroe

[danielroe]

I would recommend keeping that in as a sensible default.

[shahabbasian]

I would recommend keeping that in as a sensible default.

Are you in favor of converting all <script setup> blocks to <script setup lang="ts"> in the same pull request?

[danielroe]

Yes 👍

In general when we do things like this it would also be nice to add some kind of test or rule to ensure the default continues to be applied, but that's not necessarily on you to do.

[florian-lefebvre]

Let's convert to composition api?

[shahabbasian]

I don't know this. It may be intentional to let the user know they can work with both modes. Because in the example below, the Composition API has been used.

[danielroe]

It would be worth ultimately supporting a toggle between modes but for now we can probably leave them as they are.

Like Vue, our default should be composition API/script setup unless we are specifically explaining the options API.

[danielroe]

Thank you! ❤️