Global constants in Laravel / Vue3 / InertiaJS app

Question

What is the best way to declare a constant that can be accessed in any of the .vue pages in a Laravel 10 / Vue3 / Inertia 1.0 application ? Just a simple string, like abc = 'def' that will display on any .vue page like: {{ abc }}

I thought maybe the app.js file would be a good place to put it, but I cannot work out the correct way to do this. It doesn't need to be accessed by any php files.

I would have thought that this would be quite a simple thing - thanks in advance.

Answer 1

If the data changes and comes from the backend just use shared data. https://inertiajs.com/shared-data#accessing-shared-data

Otherwise just have a file which exports it

export const abc = "def";

and then just import it in your vue script

import { abc } from "@/js/data";