lightGallery is not defined.

I wanna to use lightGallry inside my laravel project. everything is working fine if I use their CDN, but I need to include like 3 to 4 cdn link to active lightGallry plugins, when I use with mix it gave me lightGallry not defined error.

my webpack.mix.js

mix.js('resources/js/lightgallery.js', 'public/js/lightgallery.js');

import that inside 'resources/js/lightgallery.js

import lightGallery from 'lightgallery';
import lgThumbnail from 'lightgallery/plugins/thumbnail'
import lgZoom from 'lightgallery/plugins/zoom'

how I use inside html head

<script src="{{ asset('js/lightgallery.js') }}"></script>

How I Trigger it

    <script type="text/javascript">
        lightGallery(document.getElementById('lightgallery'), {
            plugins: [ lgZoom , lgThumbnail],
            // plugins: [ lgZoom , lgThumbnail , lgRotate],
            speed: 500,
            selector: '.gallery-item',
        });
    </script>

it just not defining the lightGallery any clues ? thanks