CODEWITHSUNDEEP
laravellaravel-bladelaravel-5.4
Parth Vora
Parth Vora

Reputation: 4114

Include assets into package's blade view - Laravel

I'm creating a package using Laravel 5.4. I need to include some assets(js, CSS & images) in the blade template. How can I achieve that?

I have tried asset(), but it is not working.

Here is the folder structure of my package:

root
  --package
     -- vendor_name
        -- package_name
           -- src
              -- assets
                 -- js
                    -- login.js
                 --css
                    -- login.css
              -- views
                 -- login.blade.php

Is it something possible without publishing them into the public folder?

Thanks

Upvotes: 0

Views: 4019

Answers (2)

Angus Simons
Angus Simons

Reputation: 527

You could create a new disk in your config/filesystem.php that point to that folder.

'package' => [
            'driver' => 'package',
            'root' => base_path('package'),
        ],

in blade

{{ Storage::disk('package')->url('vendor_name/package_name/src/assets/js/login.js') }}

custom directory for the views

to edit this you have to go in config/view.php and add your paths base_path('package/vendor_name/package_name/src/views') for each package.

'paths' => [
        resource_path('views'),
        base_path('package/vendor_name/package_name/src/views'),
    ],

Upvotes: 0

Mohammed Zaki
Mohammed Zaki

Reputation: 87

In Laravel 5.4 you can use mix function it is much better if you want to use versions 

<script src="{{ mix('js/login.js') }}"></script>

see Compiling Assets (Laravel Mix)

https://laravel.com/docs/5.4/mix

mix.js(['resources/assets/js/app.js'], 'public/js')
        .sass('resources/assets/sass/app.scss', 'public/css')
        .styles([
            'node_modules/animate.css/animate.css',
            'node_modules/icheck/skins/flat/green.css',
            'node_modules/flatpickr/dist/flatpickr.css',
            'node_modules/gentelella/vendors/switchery/dist/switchery.min.css',
            'node_modules/ion-rangeslider/css/ion.rangeSlider.css',
            'node_modules/ion-rangeslider/css/ion.rangeSlider.skinFlat.css',
            'node_modules/gentelella/vendors/google-code-prettify/bin/prettify.min.css',
            //bootstrap modal carousel.js
            //'node_module/bootstrap-modal-carousel/dist/css/bootstrap-modal-carousel.css',
            'node_modules/gentelella/build/css/custom.css',
            'resources/assets/css/custom.css'
        ], 'public/css/custom.css')
        .copy('node_modules/gentelella/vendors/switchery/dist/switchery.min.js', 'public/js/switchery.min.js')
        .copy('node_modules/gentelella/vendors/switchery/dist/switchery.min.css', 'public/css/switchery.min.css')
        .copy('resources/assets/images', 'public/images')
        .copy('node_modules/ion-rangeslider/img', 'public/img')
        .copy('node_modules/icheck/skins/flat/green.png', 'public/css')
        .copy('node_modules/icheck/skins/flat/[email protected]', 'public/css').version();

Upvotes: 2

Related Questions