Laravel Mix Preload là một package cho phép người dùng Laravel-mix thông qua package này có thể tự động add các files đã mix và render ra blade dựa trên file mix-manifest. Được phát triển bởi Sebastian De Deyne và Spatie.
Hướng dẫn sử dụng Laravel Elixir Laravel Mix
Mọi thứ sẽ đơn giản hơn nhiều khi bạn đã có cài đặt sẳn Laravel-mix và đã chạy thành công Laravel-mix. Tiếp đến chỉ cần chúng ta thêm package này vào là xong.
Cài Đặt Laravel Mix Preload
composer require spatie/laravel-mix-preloadSau khi cài đặt xong. Giả sử đây là file config Laravel-mix của bạn. Chúng ta nên thêm prefix preload hoặc prefetch vào output files để dễ quản lý như sau.
{ "/js/app.js": "/js/preload-app.js", "/js/app.js": "/js/prefetch-app.js", "/css/app.css": "/css/preload-app.css", }Ngoài ra nếu có quá nhiều files bạn có thể dùng cách tự động add vào thông qua webpackChunkName .
import('./maps' /* webpackChunkName: "preload-maps" */).then(maps => { maps.init(); }); import('./maps' /* webpackChunkName: "prefetch-maps" */).then(maps => { maps.init(); });Việc tiếp theo chúng ta cần làm là thêm mark-up @preload vào header tag là xong.
<head> <title>Preloading things</title> @preload </head>F12 và xem thành quả xem nào.
<link rel="preload" href="/js/preload-app.js" as="script"> <link rel="prefetch" href="/js/prefetch-app.js" as="script"> <link rel="preload" href="/css/preload-app.css" as="style">Bạn có thể tìm hiểu thêm về package này cũng như nhận hướng dẫn cài đặt đầy đủ và xem mã nguồn trên GitHub tại spatie / laravel-mix-preload .
