كيف أخدم مشروعين من Vite في تطبيق Laravel؟

لحل مشكلتك ، يمكنك تعديل ملف vite.config.js لكي يتضمن مسارين منفصلين للبناء (build)، واحد لـل app والآخر لـ admin
يمكنك أيضا تحديث الملف blade الخاص ب Laravel ليشير إلى المسار الصحيح لملفات الـ JavaScript المبنية يجب القيام بالتلي :

تعديل ملف vite.config.js يمكنك إعداد تكوينين منفصلين داخل vite.config.js، واحد لـ app والآخر لـ admin. يجب أن يشير كل تكوين إلى نقطة الدخول (entry point) الخاصة به ودليل الإخراج (outDir).

تحديث ملفات blade في Laravel بعد إعداد ملف vite.config.js، يجب عليك تحديث ملفات blade الخاصة بك لتشير إلى المسار الصحيح لملفات JavaScript 

تشغيل عملية البناء (build)  يجب تشغيل عملية البناء لكل من app و admin لضمان إنشاء الملفات المبنية في المسارات الصحيحة.

import { defineConfig } from "vite";
import laravel from "laravel-vite-plugin";
import react from "@vitejs/plugin-react";


const appConfig = defineConfig({
    plugins: [laravel(["resources/js/app/main.jsx"]), react()],
    build: {
        outDir: "public/js/app",
        rollupOptions: {
            input: "resources/js/app/main.jsx",
        },
    },
});


const adminConfig = defineConfig({
    plugins: [laravel(["resources/js/admin/main.jsx"]), react()],
    build: {
        outDir: "public/js/admin",
        rollupOptions: {
            input: "resources/js/admin/main.jsx",
        },
    },
});


export default [appConfig, adminConfig];

//app blade
<script type="module" src="{{ asset('js/app/main.js') }}"></script>

//admin blde
<script type="module" src="{{ asset('js/admin/main.js') }}"></script>