How can I include js files correspondes to render files in laravel blade template?

Question

In my laravel app I have app.blade.php with following code

<html>
    <body>
        <div>
            @yield('content')
        </div>
        <script src="{{ asset('jquery.min.js') }}" ></script>
        <script src="{{ asset('bootstrap.min.js') }}" ></script>
    </body>
</html>

I have several pages such as page1, page2 etc and each page is rendering as page1.blade.php etc and these pages has separate javascript files like page1.js, page2.js.

page1.js should be included with page1.blade.php only and same for page2.js also. How can I include js files for the corresponding blade files?

My page1.blade.php is

@extends('layouts.app')

@section('content')
<section class="content-header">
  <h1>
    Page 1
  </h1>

</section>
@endsection

Denis Kuratovich · Accepted Answer · 2018-08-29 14:43:46Z

5

app.blade.php

<html>
    <body>
        <div>
            @yield('content')
        </div>
        <script src="{{ asset('jquery.min.js') }}" ></script>
        <script src="{{ asset('bootstrap.min.js') }}" ></script>
        @yield('script')
    </body>
</html>

and page1.blade.php

@extends('layouts.app')

@section('content')
<section class="content-header">
  <h1>
    Page 1
  </h1>

</section>
@endsection

@section('script')
  <script src="{{ asset('page1.js') }}" ></script>
@endsection

answered Aug 29, 2018 at 14:43

Denis Kuratovich

2871 silver badge6 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

FGDeveloper · Accepted Answer · 2018-08-30 19:11:24Z

1

You can use @stack method that comes after 5.1 versions. For Details: https://laravel.com/docs/5.7/blade#stacks

edited Aug 30, 2018 at 19:11

answered Aug 29, 2018 at 15:15

FGDeveloper

1,0509 silver badges24 bronze badges

Collectives™ on Stack Overflow

How can I include js files correspondes to render files in laravel blade template?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related