Change localhost:1313 to custom localhost url

support
1

Hi there,

Getting to grips with Hugo the past day or so and can’t work my head around setting up localhost urls on mac. I have created the site and it can be seen on localhost:1313 but when I tried to change the url to http://hugo.localhost through my usual method of etc/host and extra/httpd-v-host I had no luck. I attempted changing it in the config.toml too using baseurl=“http://hugo.localhost” but to no avail.

Although localhost:1313 would give me the site, when I created a new one on a different folder it ‘overwrote’ my existing site. It didn’t change code/ files or anything as the they are in two separate folders, it just used the same url localhost:1313, so my original changes to the first hugo install can’t be seen.

Is there a section of the docs on this as I have been looking over them for a while and can’t find the fix or anything similar in the forum.

Cheers,
C

2

Good morning!

Have you considered setting up a multisite workflow? That could be one way to work it out: https://discuss.gohugo.io/t/hugo-multisite-workflow/103/7

3

If you want to run two hugo server at the same time you can bind them to different ports.
You have an option for the hugo server command:

-p, --port=1313: port on which the server will listen

Also I’m not sure I got your problem right but you can different folders as destination using another option:

-d, --destination=“”: filesystem path to write files to

4

Thanks for the quick reply. Perhaps I should have phrased it better, but good news is I half way solved the issue and have a custom url but it has it’s issues. One site per port and can’t figure how to remove the port without crashing with ERR_CONNECTION_REFUSED. I also think I opted for the long Frankenstein route so have listed my method in case there is a better way.

I have an install called Website A type hugo server and it used localhost:1313 which is the default url.
It is under /www/websitea/www_root/

I then installed another copy of Hugo for a separate site, Website B. However it uses localhost:1313 on the front end too after using hugo server to make it work.
It is under /www/websiteb/www_root/

So what I would require is a means to say in the config of Website A baseurl=“http://websitea.localhost” and in Website B baseurl=“http://websiteb.localhost”.

Otherwise I have only localhost:1313 to use which would only show Website A.

So goal would be to type Hugo server and have the two accessible in the browser as simply http://websitea.localhost and http://websiteb.localhost.

Neither Website A or Website B are related so I want them totally stand alone ie if I ever delete Website A it would never effect Website B. From what I can see, Multisite workflow wouldn’t work in this case as it implies only one can work at a time by targeting configs (But, I may most likely have this wrong).

I attempted
hugo server --watch --baseUrl=http://websitea.localhost/ --port=1313 --appendPort=false
And got websitea.localhost:1313 to show the homepage, however sub pages don’t instantly work as I need to place in the port :1313 in the url to view them.

When I attempted the same again whilst in the Website B folder
hugo server --watch --baseUrl=http://websiteb.localhost/ --port=1313 --appendPort=false
websiteb.localhost:1313 shows the content of the Website A.

This implies that localhost:1313 and *:1313 is actually Website A and websitea.localhost:1313 is just a mirror of this. The downside being that any other Hugo site on the port 1313 will mirror Website A. So one port per site.

So I attempted with hugo server --watch --baseUrl=http://websiteb.localhost/ --port=52643 --appendPort=false
websiteb.localhost:52643 shows the Website B content which is correct.

Also a downside of this is typing hugo sever in terminal to start up is it will possibly wipe the custom url so each time I restart I will need to type other the full commands above.

Now I need to remove ports and still have the sites running as the url paths require the ports for the subpages and css to be present at the moment, something which they are not and shouldn’t be.

From what I can see through testing is that the themes used affect the port, creating a variant port (:52643, :51897, :51713) which in most use cases is fine but if two sites use the same theme their port may match causing the the mirror issue. I may be wrong and it is purely random on creation and it may have been coincidental for just me.

Regards
C

5

You’re assuming Hugo’s webserver proxies sitea.localhost to localhost:1313 or sitea.localhost:1313 (on whatever port), but, it doesn’t. You’d need another server that could handle that.

If you accept localhost:1313 and localhost:1414 or whatever, you can easily make a function in say, zsh, or a script, to load hugo up how you need it.

6

Here’s my zsh functions for it:

See the “hugoserver” ones.

7

Hi Rick,

Downloaded oh-my-zsh as you suggested but got a bit lost in regards to your custom plugin, do you suggest I use yours or am I to find a particular zsh file and edit it like I would an etc/host or extra/httpd-v-host file.

As for the port issue, I found hugo server --watch --baseUrl=http://websitea.localhost/ --port=52643 --appendPort=false would just place the port in the url calls and was a lesser of two evils than removing it.

Cheers
C

8

It’s just an example. You can use the function I highlighted in your own, adjusting to taste.

Zsh won’t help you in terms of vhosts. I’m saying hugo is not going to handle proxying.

9

Take a look at a web server called Caddy.

1 Like
10

@michael_henderson I’ve seen it mentioned on here and never looked into it yet. Just spent a while reading about it. Caddy looks great!