Hugo not rendering the public folder locally

Question

When I use the command hugo, it generates the index.html in the Public folder. When I open index.html, the site load like this:

But when I use the hugo serve command locally, it generates the link http://localhost:1313/, and the site load properly. It loads like this:

I think the problem is because of the not proper rendering of files or anything similar.

My approach:

• I added the code relativeURLs = true and uglyURLs = true at top of the config.toml file but still it does not rendered properly.
• I had set baseurl = "/" in config.toml file but this also does not work.

Answer 1

Your theme might be loading CSS using {{ .Site.Baseurl }}.

For example:

<link rel="stylesheet" href="{{ .Site.BaseURL }}css/style.css">

In that case, make sure that the BaseUrl defined at the top of your config.toml file is set to http://localhost:1313, which will allow your local server to find the CSS file.