Virtual Host not working as expected when I'm using .dev domain extension

I'm doing a Laravel project and I need to set up a virtual host example.dev in my system. For that I've created a copy of 000-default.conf and named it as example.dev.conf and placed in /etc/apache2/sites-available. The contents of the file is given below (comments removed):

<VirtualHost *:80>
    <Directory /var/www/html/example/public/>
        Options Indexes FollowSymLinks MultiViews
        AllowOverride All
        Require all granted
    </Directory>

    ServerName example.dev
    ServerAlias www.example.dev

    ServerAdmin [email protected]
    DocumentRoot /var/www/html/example/public

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Then I've enabled the site using a2ensite command and disabled 000-default.conf using a2dissite command. Then it will open my project when I try localhost (/var/www/html) in my browser and not example.dev. The virtual host example.dev always produce "The site can't be reached" error in browsers.

Any suggestions?

First choice domain extension different from .dev. Last year Google bought .dev, .foo and some other domain extensions. Now the redirection to https:// of these is hard coded in some browsers. More details could be find in this helpful answer.

Then edit your /etc/hosts file in this way (more details could be fund in this answer):

127.0.0.1   localhost example.local www.example.local

Then edit your <virtual-host>.conf file in the following way:

<VirtualHost *:80>

    ServerName example.local
    ServerAlias www.example.local
    ServerAdmin [email protected]

    DocumentRoot /var/www/html/example/public
    <Directory /var/www/html/example/public/>
        Options Indexes FollowSymLinks MultiViews
        AllowOverride All
        Require all granted
    </Directory>

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined

</VirtualHost>

Now, reload Apache's configuration and try to access http://example.local.

I had the same problem as I used to name all my test sites .dev -- changing all of my /etc/apache2/sites-available/ config files (and local hosts file) as per pa4080's answer fixed it for me.

Use a2dissite to remove the old configs (before you delete the files) and a2ensite to enable the new.

Make sure to reload apache with service apache2 reload as well.