How to Fix Missing Assets After Removing ‘Public’ from Laravel 11 URLs

If CSS images or other assets (like fonts, JS, etc.) are not loading after removing /public from the Laravel 11 URL, follow these steps to fix the issue:

✅ Why is this happening?

Laravel expects assets (like images) to be located in the /public folder. After removing /public from the URL, the paths to these assets might become incorrect.

✅ Solution 1: Use the `asset()` Helper in Blade Files

Ensure that all your image and CSS paths in Blade views use the asset() helper.

Example:

<img src="{{ asset('images/logo.png') }}" alt="Logo">

For CSS:

<link rel="stylesheet" href="{{ asset('css/app.css') }}">

If you are using background images in inline CSS, use the following:

<div style="background-image: url('{{ asset('images/background.jpg') }}');">

✅ Solution 2: Update Image Paths in CSS Files

If your images are referenced in your CSS, update their paths.

Change:

background: url('/images/background.jpg');

To:

background: url('../images/background.jpg');

Or, if the images are in /public, use the absolute path:

background: url('/public/images/background.jpg');

If you are using Vite in Laravel 11, update asset paths using @vite:

background: url('/images/background.jpg');

✅ Solution 3: Ensure `.htaccess` is Configured Properly

Check that you have the correct .htaccess in the root of your Laravel project.

Here is the correct configuration:

<IfModule mod_rewrite.c>
    RewriteEngine On

    # Redirect requests to public/index.php
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.*)$ public/index.php/$1 [L]
</IfModule>

✅ Solution 4: Adjust Vite Configuration (If Using Vite)

If your CSS is compiled using Vite (default in Laravel 11), ensure the base path is set correctly.

Check your vite.config.js file:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    base: '/', // Ensure this is correct
});

Rebuild assets:

npm run build

✅ Solution 5: Ensure Apache is Set Correctly

If using Apache, check that it allows .htaccess overrides.

Open the configuration:

sudo nano /etc/apache2/sites-available/000-default.conf

Ensure this section is present:

<Directory /var/www/html/your-laravel-app>
    Options Indexes FollowSymLinks
    AllowOverride All
    Require all granted
</Directory>

Restart Apache:

sudo systemctl restart apache2

✅ Solution 6: Clear Cache

Ensure that cached views and routes are cleared:

php artisan cache:clear
php artisan config:cache
php artisan route:cache
php artisan view:cache

✅ Solution 7: Test the Application

Ensure your image loads via:

http://your-domain.com/images/logo.png

Check the CSS file by visiting:

http://your-domain.com/css/app.css

✅ Final Check

Ensure your images are in the correct location:

Public images should be in /public/images
CSS should reference these correctly using asset() or relative paths.

Would you like more help with Nginx, Vite, or other issues? 😊

About The Author

Manoj Damor

See author's posts