Laravel Türkiye Discord Kanalı Forumda kod paylaşılırken dikkat edilmesi gerekenler!Birlikte proje geliştirmek ister misiniz?

Kurulumda gelen App dosyaları

gundogduyakici

Merhaba,
Laravel kurulumunda gelen App.css ve App.js silinmemeli mi ? Ne işe yarıyor ? Ben hepsini kaldırdım sadece site ile alakalı dosyalar mevcut. Her hangi bir sorun yaşar mıyım ?

ac1919

Laravel mix ve Vuejs kullanmayacaksan silebilirsin.

gundogduyakici

Anladım teşekkürler. Peki laravel mix nedir? css, js dosyalarını sıkıştırmak için kullanılan bir araç mı webpack gibi ?

ac1919

dodiş yazdıAnladım teşekkürler. Peki laravel mix nedir? css, js dosyalarını sıkıştırmak için kullanılan bir araç mı webpack gibi ?

Evet bootstrap componentleri hazır geliyor frontend tarafını çok kolaylaştırıyor. Ben pek deneyimli değilim laravel mix'te ama deneyimli arkadaşlar detaylı bilgi verir mutlaka.

gundogduyakici

Teşekkürler

mgsmus

Laravel Mix, uygulamanızda Webpack kullanabilmeniz için öntanımlı Webpack ayarlarından oluşan bir çeşit API'dır.
Webpack her ne kadar güzel olsa da ayarlaması çok uzun ve yorucu oluyor. Laravel Mix bu ayarlarla zaman kaybetmenizi engelliyor, dokümanlara göre ise Webpack kullanım alanlarının %80'ini kapsayacak işlemleri yapısında barındırıyor.

Örneğin:

mix.config.fileLoaderDirs.fonts = 'assets/fonts';

yaptığınızda içerisinde font barındıran SCSS/CSS dosyalarını parselleyip fontları bu klasöre kopyalıyor ve CSS oluştururken dosya yollarını otomatik düzenliyor. Bunu Webpack'de ayarlamak biraz zaman alacaktır ama Laravel Mix ile bir satır tanımlama ile halletmiş oluyorsunuz.

sineld

Projelerimden birinden alıp örnek teşkil edecek şekilde azalttığım bir örnek aşağıdadır.

let mix = require('laravel-mix');

mix.config.fileLoaderDirs.fonts = 'assets/fonts';

// js
mix.combine([
 'resources/assets/js/main/jquery.min.js',
 'resources/assets/js/main/bootstrap.bundle.min.js',
 'resources/assets/js/app.js',
 'resources/assets/js/custom.js'
], 'public/assets/js/scripts.js');

// Dizideki elemanları birleştirerek public/assets/js/scripts.js dosyasını oluşturur.

// css
mix.combine([
 'resources/assets/css/loading.css',
 'resources/assets/css/fonts.css',
 'resources/assets/css/icons/fontawesome/styles.min.css',
 'resources/assets/css/icons/icomoon/styles.css',
 'resources/assets/css/bootstrap.css',
 'resources/assets/js/plugins/notifications/sweet_alert.min.css',
 'resources/assets/js/plugins/magnific-popup/magnific-popup.css',
 'resources/assets/css/custom.css'
], 'public/assets/css/styles.css');

// Dizideki elemanları birleştirerek public/assets/js/styles.css dosyasını oluşturur.

mix.version([
 'public/assets/js/scripts.js',
 'public/assets/css/styles.css',
]);

// Dizideki elemanlar için sürüm oluşturur.