Connecting localhost:3000 in vagrant from host machine

Question

How do I connect guest localhost:3000 from host machine?

So I have set up a Vue project in Vagrant. vagrant ssh in and serving the project by yarn dev and it shows that it's running on localhost:3000 in Vagrant.

Here is my Homestead.yaml configuration: - map: consumer.test to: /home/vagrant/projects/Consumer

On my host machine, I have added edited my hosts file as following: 192.168.10.10 consumer.test

So I went to consumer.test on my host machine, but of course it won't run cus the port number is missing, and gives the following error: 403 Forbidden nginx/1.13.6

How do I fix this?

Answer 1

Okay. I just got it sorted.

Step 1

First I have to forward the port number from guest(vagrant ssh) to host machine. This is done through Homestead.yaml configuration:

d ports: - send: 80 (from host) - to: 3000 (to guest machine)

OR

you can add this to your Vagrant config: config.vm.network "forwarded_port", guest: 3000, host: 80, auto_correct: true

Step 2

I changed my C:\\Windows\\System32\\drivers\\etc\\hosts configuration from:

192.168.10.10 consumer.test

to

127.0.0.1 consumer.test

Step 3

As I'm using Vue (nuxt). I added HOST=0.0.0.0 PORT=3000 in my package.json "scripts": { "dev": "HOST=0.0.0.0 PORT=3000 nuxt", "build": "nuxt build", "start": "nuxt start", "generate": "nuxt generate", "lint": "eslint --ext .js,.vue --ignore-path .gitignore .", "precommit": "npm run lint" },

Now I just need to vagrant ssh in the project folder and run yarn dev . On the host machine now I can access it from consumer.test .

Thanks