'laravel [Vue warn]: Error compiling a template

I am getting error while compiling Vue. I have included at the bottom of the page

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

    <script type="text/javascript">
        @yield('script')
    </script>

From the blade I inserting a javascript

 @section('script')

 jQuery(document).ready(function(){
$('.carousel').carousel({
    interval: 6000
});

  });
  @endsection

What is the right way to insert jquery inside a template

I have included the script in app.js

require('./jquery-ui');
require('./bootstrap');
require('./bootstrap-dropdownhover.min');
require('./custom');
laravelvue.js


Solution 1:[1]

You can't insert script tag inside Vue template, but you can insert script tag outside Vue scope.

You can use Laravel Blade Stacks

Solution 2:[2]

You can find your answer at https://laravel.com/docs/5.7/blade#stacks

@push('scripts')
    <script> put whatever you want here </script>
@endpush

Solution 3:[3]

The suggestions above seem accurate, but a simple unclosed div might be your problem, I had the same issue, my mistake was that I had an unclosed div.

~regards

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Giorgi
Solution 2 guttume
Solution 3 Michael Kiarie

Related Questions