How to add comments in Svelte templates
How to avoid Svelte to render parts of a template to the client
HTML comments are great to hide elements from a page.
In HTML here’s how you add a comment:
<!-- a comment here -->
You can use this on blocks, too, to hide multiple lines of HTML:
<!--
a
comment
here
-->
Note that this is still visible in the page source. The browser just hides it, but one can always go and see the comment.
You can use the same comments in your Svelte templates. But with Svelte you don’t send the commented part to the browser. That part is completely removed, and only stay in your source files, invisible to the HTML generated into the page.
Which in my opinion is a positive thing.
→ I wrote 17 books to help you become a better developer:
- C Handbook
- Command Line Handbook
- CSS Handbook
- Express Handbook
- Git Cheat Sheet
- Go Handbook
- HTML Handbook
- JS Handbook
- Laravel Handbook
- Next.js Handbook
- Node.js Handbook
- PHP Handbook
- Python Handbook
- React Handbook
- SQL Handbook
- Svelte Handbook
- Swift Handbook
Also, JOIN MY CODING BOOTCAMP, an amazing cohort course that will be a huge step up in your coding career - covering React, Next.js - next edition February 2025