HowTo - Fix list rendering in Hugo
While working with Hugo I noticed an interesting problem - on some pages lists are not rendered as lists in final build, even though the same lists work properly on local Hugo server.
Let’s investigate this problem. First of all we will create a simple list with markdown:
This is my list:
* Item 1
* Item 2
* Item 3
After adding this code to the markdown file we can see how Hugo renders it on development build (hugo server) and on production build (hugo)
| Development build: | Production build: |
|---|---|
 |
 |
So, development build is working properly, but production build doesn’t render the list. How to fix this wrong rendering? The is a very simple fix - just add an empty line between first list item and previous text block:
This is my list:
* Item 1
* Item 2
* Item 3
Let’s see a result.
This is my list:
- Item 1
- Item 2
- Item 3
As we can see, after the fix the list is displayed properly on both local and production builds.
Image credits:
