add hugo version without this build fails in netlify

Author: drewgo

Diff for: content/docs/hugo.md

@@ -3,6 +3,7 @@ group: Guides
 weight: 20
 title: Hugo
 ---
+
 ## Introduction
 
 This guide will walk you through how to integrate Decap CMS with Hugo. This is a good place to start if you want to learn from the ground up how these two tools work together. If you want to get up-and-running quicker, you can use one of the pre-existing and amazing [starter templates](/docs/start-with-a-template/)!
@@ -90,22 +91,43 @@ backend:
 media_folder: static/img
 public_folder: /img
 collections:
-  - name: 'blog'
-    label: 'Blog'
-    folder: 'content/blog'
+  - name: "blog"
+    label: "Blog"
+    folder: "content/blog"
     create: true
-    slug: '{{year}}-{{month}}-{{day}}-{{slug}}'
+    slug: "{{year}}-{{month}}-{{day}}-{{slug}}"
     editor:
       preview: false
     fields:
-      - { label: 'Title', name: 'title', widget: 'string' }
-      - { label: 'Publish Date', name: 'date', widget: 'datetime' }
-      - { label: 'Description', name: 'description', widget: 'string' }
-      - { label: 'Body', name: 'body', widget: 'markdown' }
+      - { label: "Title", name: "title", widget: "string" }
+      - { label: "Publish Date", name: "date", widget: "datetime" }
+      - { label: "Description", name: "description", widget: "string" }
+      - { label: "Body", name: "body", widget: "markdown" }
 ```
 
 **Note:** You won't be able to access the CMS just yet — you still need to deploy the project with **Netlify** and authenticate with **Netlify Identity**. You'll handle this in the next few steps of this guide.
 
+### Configuring Netlify Build Settings
+
+To ensure consistent builds on Netlify, create a `netlify.toml` configuration file at your project's root with these settings:
+
+```toml
+[build]
+  command = "hugo"
+  publish = "public"
+
+[context.production.environment]
+  HUGO_VERSION = "0.128.0"
+```
+
+This configuration:
+
+1. Specifies the exact Hugo version Netlify should use (match this to your local Hugo version)
+2. Defines the build command that generates your site
+3. Sets the publish directory to Hugo's default output folder
+
+**Note:** Explicitly setting the Hugo version prevents unexpected build issues from version mismatches between your local environment and Netlify's auto-detected version.
+
 ### Pushing to GitHub
 
 It's now time to commit your changes and push to GitHub. You can run the following commands to initialize a git repository and push the changes so far.
@@ -163,9 +185,7 @@ In your `layouts/index.html` file, you'll create an unordered list element and u
   <ul>
     {{ range (where .Pages "Section" "blog") }}
     <li>
-      <a href="{{ .RelPermalink }}">
-        {{ .Title }}
-      </a>
+      <a href="{{ .RelPermalink }}"> {{ .Title }} </a>
     </li>
     {{ end }}
   </ul>
@@ -191,9 +211,7 @@ Create a file `layouts/blog/single.html`, and put the following content in there
     <h1>{{ .Title }}</h1>
     <p class="date">{{ .Date }}</p>
     <p class="description">{{ .Params.description }}</p>
-    <article class="content">
-      {{ .Content }}
-    </article>
+    <article class="content">{{ .Content }}</article>
   </body>
 </html>
 ```
@@ -210,32 +228,39 @@ You can refer to [registering editor components](https://www.decapcms.org/docs/c
 
 ```javascript
 CMS.registerEditorComponent({
-    id: "gist",
-    label: "Gist",
-    fields: [{
-            name: "username",
-            label: "GitHub Username",
-            widget: "string"
-        },
-        {
-            name: "gid",
-            label: "Gist ID",
-            widget: "string"
-        },
-    ],
-    pattern: /^{{< gist ([a-zA-Z0-9]+) ([a-zA-Z0-9]+) >}}/,
-    fromBlock: function(match) {
-        return {
-            username: match[1],
-            gid: match[2],
-        };
-    },
-    toBlock: function(obj) {
-        return `{{< gist ${obj.username} ${obj.gid} >}}`;
+  id: "gist",
+  label: "Gist",
+  fields: [
+    {
+      name: "username",
+      label: "GitHub Username",
+      widget: "string",
     },
-    toPreview: function(obj) {
-        return '<a href="https://gist.github.com/' + obj.username + '/' + obj.id + '">gist</a>';
+    {
+      name: "gid",
+      label: "Gist ID",
+      widget: "string",
     },
+  ],
+  pattern: /^{{< gist ([a-zA-Z0-9]+) ([a-zA-Z0-9]+) >}}/,
+  fromBlock: function (match) {
+    return {
+      username: match[1],
+      gid: match[2],
+    };
+  },
+  toBlock: function (obj) {
+    return `{{< gist ${obj.username} ${obj.gid} >}}`;
+  },
+  toPreview: function (obj) {
+    return (
+      '<a href="https://gist.github.com/' +
+      obj.username +
+      "/" +
+      obj.id +
+      '">gist</a>'
+    );
+  },
 });
 ```