在Laravel 中搭配Async Vue Component 使用 | laravel vue整合
Laravel中,如果是基於要和使用者互動操作的一些介面(元件),透過撰寫VueComponent可以很方便地在各個LaravelBlade中輕鬆地透過
Laravel 中,如果是基於要和使用者互動操作的一些介面(元件),透過撰寫 Vue Component 可以很方便地在各個 Laravel Blade 中輕鬆地透過 <Component /> 的 tag 方式來重複使用 Vue Component。
目前在 Laravel 的前端打包工具大部分都是透過 laravel-mix[1] 做整合,前陣子也才幫系統的 laravel-mix 升級到 2.0.0 版本,基本上是無痛升級;在去年的「從 laravel-mix 0.8 升級到 1.4 版的記錄與坑[2]」這邊文章提到使用「async/await[3]」的方式現在也不需要安裝額外的 babel-plugin 也都可以使用了,而且現在 Laravel 內你也不需要建立 .babelrc 來設定相關 babel 的設定。
這次主要記錄是怎麼在 Laravel 中設定並使用「非同步載入 的 Vue Component」,Vue.js[4] 官方文件在 Component[5] 部分也有對於 Async Component[6] 也有相關解釋,如果不太了解的話,可以參考一下。
簡單說明一下,在大型的 Application 我們可能會有許多的程式碼,但是我們希望不要一次把所有的程式碼都給打包起來,這樣會造成 bundle 的檔案過大,網頁在載入時會比較慢,而且並不是每個程式碼都會被頁面所需要,這時候我們...