Comment obtenir une variable d'environnement dans Laravel React JS

Laravel 9 a ajouté Vite pour le développement frontal React JS et Vue JS et si vous avez besoin d'ajouter une variable d'environnement dans le fichier .env et que vous devez accéder à la variable .env dans l'application react js, je vous aiderai à obtenir une variable d'environnement dans laravel réagir application js. Laravel a ajouté import.meta.env pour accéder à toutes les variables .env dans le fichier js.

Dans ce didacticiel, nous apprendrons comment obtenir une variable d'environnement dans Laravel React Vite Pour comprendre comment obtenir des variables d'environnement dans Laravel React JS, nous faisons l'exemple suivant

Comment obtenir une variable d'environnement dans Laravel React JS avec un exemple de code

Ajouter une variable d'environnement :

VITE_APP_NAME="Vite React Demo Title"

Accéder à la variable d'environnement :

Maintenant, nous allons accéder à la variable d'environnement "VITE_APP_NAME" avec le titre dans le fichier react js. voyons la solution ci-dessous avec un exemple:

import.meta.env.VITE_APP_NAME;

Exemple de code :

import './bootstrap';
import '../css/app.css';
  
import React from 'react';
import { render } from 'react-dom';
import { createInertiaApp } from '@inertiajs/inertia-react';
import { InertiaProgress } from '@inertiajs/progress';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
  
const appName = import.meta.env.VITE_APP_NAME;
  
createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => resolvePageComponent(`./Pages/${name}.jsx`, import.meta.glob('./Pages/**/*.jsx')),
    setup({ el, App, props }) {
        return render(<App {...props} />, el);
    },
});
  
InertiaProgress.init({ color: '#4B5563' });

Bon codage !!!