Deploy Laravel Inertia with apache

I have been developing an Inertia Laravel Vue project for a while now and have around a year of experience with Laravel. I find it much easier to use a local server for development purposes. I simply run npm run build to build the front-end, then use php artisan serve to start up the application.

Steps:

1.Run npm run build to generate the production-ready files in the public directory.

2.Create a folder and put the entire project inside it:

• Path: /var/www/html/project/

3.Copy the contents of the project's public to the root of Apache:

• Source path: /project/public
• Destination path: /var/www/html/

4.Configure index.php (using two dots for the name of the created folder):

• Path: /var/www/html/index.php
• Edit the file and replace folder_created_name with the name of the folder you created.

<?php

use Illuminate\Contracts\Http\Kernel;
use Illuminate\Http\Request;

define('LARAVEL_START', microtime(true));

if (file_exists($maintenance = __DIR__.'/folder_created_name/storage/framework/maintenance.php')) {
    require $maintenance;
}
require __DIR__.'/folder_created_name/vendor/autoload.php';
$app = require_once __DIR__.'/folder_created_name/bootstrap/app.php';

$kernel = $app->make(Kernel::class);

$response = $kernel->handle(
    $request = Request::capture()
)->send();

$kernel->terminate($request, $response);

5.Make sure the configuration of .htaccess is correct: Path: /var/www/html/.htaccess

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Send Requests To Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

Additional step if you're still experiencing issues with Apache:

1 Configure Apache (modify /etc/apache2/sites-available/000-default.conf):

• Path: /etc/apache2/sites-available/000-default.conf
• Find the VirtualHost section that corresponds to your site and add the following block inside it:

<Directory /var/www/html>
   Options Indexes FollowSymLinks
   AllowOverride All
   Require all granted
</Directory>

• Save and close the file

2.Enable the Apache rewrite module:

• Run the command sudo a2enmod rewrite to enable the module.

3.Restart Apache:

• Run the command sudo systemctl restart apache2 to restart Apache and apply the changes.

These steps should help resolve any issues you may be having with Apache.

Additional step to resolve the issue of duplicated routes URL:

If you're experiencing issues with duplicated routes, where accessing your_ip/project/public/ results in a duplicated /project/public/project/public in the URL, you can try the following fix:

• Navigate to the directory vendor/inertiajs/inertia-laravel/src/Response.php
• Find the toResponse function and locate the variable $page which should be structured like this:

$page = [
   'component' => $this->component,
   'props' => $props,
   'url' => $request->getBaseUrl().$request->getRequestUri(),
   'version' => $this->version,
];

• Modify the 'url' line to be:

'url' => $request->getRequestUri(),

Save the file and try accessing your site again. This should resolve any issues with duplicated routes.

Sure, here's the section in Markdown:

Troubleshooting: Permission Errors

If you're running into errors related to file or directory permissions, you may need to use the chmod command to adjust the permissions. The chmod command allows you to modify the read, write, and execute permissions of a file or directory.

For example, if you're seeing errors related to file permissions when trying to build your front-end assets with npm run build, you can try running the following command to give yourself full read, write, and execute permissions for the node_modules directory:

chmod -R 777 node_modules

Be aware that using the chmod command can be potentially risky, as it can give full access to anyone who has access to the file or directory. Be sure to use it carefully and only when necessary.

I hope these steps help you deploy your project on a server!

The problem I am now having is that I am trying to deploy a laravel vue inertiajs project onto a subdirectory on the server: http://mydomain.com/my-project and it keeps redirecting me to the root of the domain and none of the links work. Does anyone has experience with this?