I have a Vue.js project and Laravel project in apache.

I put Vue.js at C:/Apache24/htdocs/vue_project_name, put Laravel at C:/Apache24/htdocs/laravel_project_name, so I can get the configuration as below:

Virtualhost DocumentRoot: "C:/Apache24/htdocs/".

Frontend URL: "http://domain_name/vue_project_name"

Backend URL: "http://domain_name/laravel_project_name"

Backend API URL: "http://domain_name/laravel_project_name/public/api"

I want to rewrite the URL when I input http://domain_name, browser will direct to http://domain_name/laravel_project_name. And I input http://domain_name/api, browser will direct to http://domain_name/laravel_project_name/public/api.

For example, I have an API, I can call http://domain_name/laravel_project_name/public/api/login to get the resource but I want it simplify to http://domain_name/api/login to get the resource.

How to do that?

It is my httpd-vhosts.conf:

<VirtualHost *:80>
    DocumentRoot "C:\Apache24\htdocs"
    ServerName domain_name
    ErrorLog "C:\Apache24\logs\error.log"
    CustomLog "C:\Apache24\logs\access.log" combined
    <Directory "C:\Apache24\htdocs"> 
        Options Indexes FollowSymLinks
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

I know how to do that when I input http://domain_name, apache will direct to http://domain_name/laravel_project_name, it seem like:

<VirtualHost *:80>
    DocumentRoot "C:\Apache24\htdocs\vue_project_name"
    ServerName domain_name
    ErrorLog "C:\Apache24\logs\error.log"
    CustomLog "C:\Apache24\logs\access.log" combined
    <Directory "C:\Apache24\htdocs\vue_project_name"> 
        Options Indexes FollowSymLinks
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

But I think it will affect backend path, so I need a better solution.

Thanks.