آموزش استفاده از vue-cli به جای laravel mix

امروزه بسیاری از برنامه نویسان سمت موبایل یا کسانی که با vue.js کار میکنند پیشنهاد اصلی جهت توسعه vue cli است که لاراول در استفاده از vue با روش استفاده از webpack این کار را انجام میدهد که خوبی ها و بدی هایی دارد . برنامه نویسان vue.js میخواهند backend و api ها را با استفاده از لاراول انجام دهند و سورس فرانت و بک اند را در یک پروژه داشته باشند . مثلا جهت کنترل لاگین از Laravel Passport یا Jwt استفاده کنند و از قابلیت هایی Real time بودن هنگام توسعه اپ های vue.js استفاده کنید خوب برای این کار آقای Evan You مبتکر و سازنده vue.js راهکار ساده و حرفه ای دارد در این راهکار نیاز به تغییر زیرساختی لاراول نیست . نیاز به نصب هیچ پکیجی نیست در این روش به راحتی لاراول را به عنوان بک اند و vue را با cli به صورت پیش فرض خود vue به کار بگیرد.
آقای evan you در صفحه github خود به این آموزش پرداخته است البته در این صفحه در نسخه ۵ لاراول این کار را انجام داده و اگر شما بخواهید این کار را در لاراول 6 یا 7 اجرا کنید کافی است مراحل درج شده در منبع اصلی را به درستی اجرا کنید. در این روش شما از vue route در طراحی اپلیکیشن میتوانید استفاده کنید

این روش برای چه پروژه هایی مناسب است ؟ پروژه های موبایلی یا نرم افزارهای تحت وب دو نوع کلی و اصلی مخاطبان این روش هستند . از طرفی میتوان لایه frontend را از backend جدا کنید و دو تیم مختلف روی ان کار کنند.

vue cli with laravel

لینک gituhb

خلاصه ای از مراحل انجام کار . ابتدا شما میتوانید نمونه ای پیش ساخته شده با لاراول 5 را دانلود و تست کنید در غیر اینصورت در نسخه های بالاتر لاراول مراحل ذکر شده در آموزش اصلی را ادامه دهید

 ابتدا لاراول را نصب کنید و با دستور  vue create frontend پروژه جدیدی از vue-cli را درون پروژه لاراول ایجاد میشود لازم است که فایل frontend/vue.config.js را مطابق کدهای درج شده در سایت github تغییر دهید . لازم است فایل frontend/package.json را هم مطابق آموزش تغییر دهید.

در این آموزش همه api ها مطابق استاندارد api نویسی در لاراول انجام میشود و در فایل routes/web.php تنها یک route آن هم برای اجرای صفحه اول و اجرای vue app ساخته میشود مابقی کارها در routes/api.php مطابق نیاز شما است و در app/Http/Controllers/SpaController.php هم صفحه اصلی را باز کنید. در این آموزش درون فایل routes/api.php  (مطابق نمونه ای که وجود دارد ) را اگر باز کنید میتوانید مسیر /mock را جهت اولین تست خود انجام دهید.


    مطالبی که به شما پیشنهاد میشود