how to load assets into laravel 'properly'

Published 1 year ago by on3nx

Hi,

i'm still learning how gulp, npm, elixir and laravel - how are they related.

I know that if you want to load asset into laravel, you can just copy paste the file into the folder and load it directly from your blade template.

but i'm wondering , if i have jquery, or bootstrap or any standard/common (.js or .css) assets, how to load it 'properly' in laravel? - rather than i download and copy-paste the file and load it manually in blade template.

when i said 'properly' i'm referring to using npm and gulp, load it from internet repository, compile it and minify it then put it nicely in blade template with cache-buster.

Thanks, 1-nk

Best Answer (As Selected By on3nx)
tomopongrac
nate.a.johnson

Your question is pretty open and there are dozens of ways to do it. A fresh Laravel 5.3 application has it set up to build your css and javascript assets with gulp and elixir out of the box. Assuming you are a Laravel user, take a look at how it's done in there.

tomopongrac
on3nx
on3nx
1 year ago (4,130 XP)

Thanks @tomi and @nate.a.johnson

your link: https://laravel-news.com/2015/10/setup-bootstrap-sass-with-laravel-elixir/ helps a lot.

basically (correct me if i'm wrong),

  1. define your dependencies in package.json
  2. load them 'npm install'
  3. your assets will be loaded in: 'node_modules'
  4. define it in: 'resources/assets/sass/app.scss'
  5. then gulp it.

if you have multiple files, you can configure it using elixir which explained in: https://laravel.com/docs/5.3/elixir

Thanks!

nate.a.johnson

That's a good start. You can do the same with javascript too. Even if you don't use Laravel 5.3, download it and look at a fresh application. It sets up both sass and javascript to be done with gulp and elixir.

Please sign in or create an account to participate in this conversation.