scripts - .modal(), .tab, .tooltip is not a function jQuery

admin管理员组

文章数量:1122846

Our site has been getting these recurring errors which I cannot track down and just needed some guidance. Each error revolves around jQuery and Bootstrap 4.6 methods as not a function. Here's what I've done so far:

1. Made sure jQuery is loaded first and all other scripts are dependent on jQuery
2. Made sure all of our jQuery-dependent scripts are loaded in the footer (our site loads jQuery in the header...is this correct?)
3. Tried calling methods in the following ways:

// One
jQuery('#example-modal').modal('show');


//Two
$('#example-modal').modal('show');


// Three
jQuery(($) => { $('#example-modal').modal('show') });

Here is how we're loading the scripts:

// Popper
wp_enqueue_script( 'popper-js', get_template_directory_uri() . '/assets/js/popper.min.js', array( 'jquery' ), $version, true );

// Bootstrap (in footer??)
wp_enqueue_script( 'bootstrap-js', get_template_directory_uri() . '/assets/js/bootstrap.min.js', array( 'jquery', 'popper-js' ), $version, true );

// Theme
wp_enqueue_script( 'theme-js', get_template_directory_uri() . '/assets/js/theme.bundled.js', array( 'jquery', 'bootstrap-js' ), $version, true );

These methods work for me all the time on a mac with FireFox, but I'm still getting them in Sentry. I've noticed the vast majority (96%) is on Windows >= 10.

Here are some some links to the error:

Error 1 Error 2 Error 3

For more context, I write JS in almost exclusively vanilla JS until I need a Bootstrap method. Am I missing something? This is driving me a little crazy.

本文标签： scriptsmodal()tabtooltip is not a function jQuery