Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

DanielRønfeldt's avatar

Custom validation error messages: Jetstream + Inertia + Vue?

On a Laravel 11 Jetstream project that's using the Inertia + Vue stack, I need to customize the default validation messages.

For such purpose, I published the language files with php artisan lang:publish, which resulted in the auth.php, pagination.php, passwords.php, and validation.php files within the /lang/en/ folder.

I found the specific message I was looking for in validation.php, under the 'min' key:

'min' => [
        'array' => 'The :attribute field must have at least :min items.',
        'file' => 'The :attribute field must be at least :min kilobytes.',
        'numeric' => 'The :attribute field must be at least :min.',
        'string' => 'THE :attribute FIELD MUST BE AT LEAST :min CHARACTERS.', <<< I modified this line
    ],

The expected behavior is that, upon entering a password shorter than the defauls 8 characters into the /register form, the validation error message displayed below the password field should be the one I wrote above in uppercase. However, for some reason, my modifications are getting ignored.

What is the correct approach to changing the default validation error messages? Any ideas will be highly appreciated.

0 likes
7 replies
LaryAI's avatar
Level 58

To customize the validation error messages in a Laravel Jetstream project using Inertia and Vue, you've already taken the correct first step by publishing the language files and modifying the validation.php file. However, if your changes are not being reflected, there could be a few reasons why this is happening. Here's a step-by-step approach to ensure your custom validation messages are used:

  1. Clear Cache: Laravel caches the language files, so after making changes to validation.php, you should clear the cache to make sure your changes are picked up. Run the following command:
php artisan cache:clear
  1. Compile Assets: If you're using Vue components, make sure to recompile your assets with Mix, as your JavaScript files may be cached as well:
npm run dev

or if you're using production:

npm run prod
  1. Check Vue Component: Ensure that the Vue component responsible for displaying the error message is correctly referencing the error message provided by the backend. In your Vue component, you should have something like this to display errors:
<template>
  <!-- ... -->
  <span v-if="form.errors.has('password')" class="error">{{ form.errors.get('password') }}</span>
  <!-- ... -->
</template>
  1. Inspect Inertia Response: When a validation error occurs, Laravel's validation system automatically injects the error messages into the session. Inertia then picks up these messages and passes them to your Vue components. Use your browser's developer tools to inspect the network response from your registration request to ensure the custom validation messages are being sent back to the client.

  2. Check Language Files: Double-check that you are editing the correct language files. If your application is set to a different locale, you might be editing the wrong file. The locale can be set in the config/app.php file:

'locale' => 'en',

Make sure it matches the language files you are editing.

  1. Check for Overridden Messages: If you have custom validation logic in your form request or controller that specifies custom messages, these will override the ones in your validation.php file. Look for any messages() method or $messages array that could be specifying a different message for the min rule.

If you've gone through all these steps and the problem persists, consider checking the Laravel and Inertia documentation for any updates or changes in how validation errors are handled, as there might have been changes since the last time you checked.

Remember to also check the browser console for any JavaScript errors that might be preventing the error messages from displaying correctly.

DanielRønfeldt's avatar

According to @laryai 's suggestions, I did the following:

  1. Cleared the cache with php artisan cache:clear
  2. Re-compiled the Vue assets by Ctrl + C followed by npm run dev
  3. The /resources/js/Pages/Auth/Register.vue Vue Component is untouched, I didn't change anything since starting the project from scratch
  4. I inspected the Inertia response in the browser's dev tools, which contains the default validation error message, which only confirms the fact that my modified validation error message is not being used at all.
  5. I made sure the language files are the default en ones (with the exception of the string message in /lang/en/validation.php I never touched them anyway).

What can I do in order to "instruct" Laravel to use my custom error messages instead of the default ones? Thanks!

gych's avatar

Strange that it's not working.

Do you have lang folder file in resources folder resources/lang ?

DanielRønfeldt's avatar

@gych I do not. Could you please explain what's the role of such folder, and what should it contain?

Thanks!

gych's avatar
gych
Best Answer
Level 29

In older Laravel versions the lang folder was located in resources/lang but now it should be at the same level as resources. Laravel still checks if there exists a lang folder in resources, if it exists it will use that folder.

This is from the source code application.php

        $this->useLangPath(value(function () {
            return is_dir($directory = $this->resourcePath('lang'))
                        ? $directory
                        : $this->basePath('lang');
        }));

Can you try and copy the lang folder inside resources? I'm curious if that will work

1 like
DanielRønfeldt's avatar

@gych copying the lang folder into the resources folder did the trick! It's weird that it wouldn't work otherwise, considering that I'm using the latest Laravel version (11.x). But it doesn't matter now, as long as it works I am happy with it :)

Many thanks for your help!

gych's avatar

@DanielRønfeldt No problem :) I'm glad it works now ! Personally I also always keep the lang folder in the resources since I'm used to that from previous versions.

1 like

Please or to participate in this conversation.