Sometimes javascript loading fine and other times doens't work - Laravel

Question

I am having a weird issue with one of the site I have been building, sometimes my website will load blank because the Javascript crashes because a file couldn't be loaded and other times it just works fine.

It's now returning; main-client.js:243 Uncaught TypeError: $(...).waypoint is not a function.

You can see it being loaded here:

I am also loading all the files correctly in the footer layout:

<!-- Vendor JS Files -->

<script src="{{ asset('assets/vendor/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ asset('assets/vendor/jquery.easing/jquery.easing.min.js') }}"></script>
<script src="{{ asset('assets/vendor/php-email-form/validate.js') }}"></script>
<script src="{{ asset('assets/vendor/waypoints/jquery.waypoints.min.js') }}"></script>
<script src="{{ asset('assets/vendor/counterup/counterup.min.js') }}"></script>
<script src="{{ asset('assets/vendor/owl.carousel/owl.carousel.min.js') }}"></script>
<script src="{{ asset('assets/vendor/isotope-layout/isotope.pkgd.min.js') }}"></script>
<script src="{{ asset('assets/vendor/venobox/venobox.min.js') }}"></script>
<script src="{{ asset('assets/vendor/aos/aos.js') }}"></script>
<script src="{{ asset('js/main-client.js') }}" defer></script>

Answer 1

Adding the preload attribute on link the in the header can solve that. In this link, show how that work