0
119
Viewsblade @push scripts , jquery: $ is not a function
I have a component file:
my-component.blade.php
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
......
</head>
<body>
........
<script src="/vendor/jquery/jquery.min.js" defer></script>
@stack('scripts')
</body>
</html>
otherfile.blade.php
<x-my-component>
.....
@push("scripts")
<script defer>
console.log($("body")); // a simple print element
</script>
@endpush
</x-my-component>
browser console
Uncaught TypeError: $ is not a function
I have tried to use yield and section and got the same result
how can I solve this problem? (I have the jquery file on my public vendor so there's no way the problem is about jquery import path)
·
Juan Pablo Isaza
1 answers
Answer question0
From the documentation for the script element:
Warning: [The
defer] attribute must not be used if the src attribute is absent (i.e. for inline scripts), in this case it would have no effect.
So the script that loads jQuery is executed after the document is parsed and the script which tries to use it is executed immediately (because the defer attribute is ignored) which is before $ is added to the scope of the page.
·
Juan Pablo Isaza
Report
Answer question