WordPress enqueue noConflict() error $ not a function?

问题

Been a WP dev for 8 years, this problem has never gone away and it's driving me insane. $ is not a function always show up, or jQuery is not a function, or foundation is not a function ... someone help me nip this in the bud once and for all?

My enqueue.php:

// initialize packages ...
function source_enqueue() {

    // init $wp_styles variable
    // adds conditional wrapper around ie stylesheet
    global $wp_styles;
    if (!is_admin()) {

        // jquery, bower, foundation, app js, style, app css

        // init jquery ...
        wp_enqueue_script( 'jquery' );
        // init foundation
        wp_enqueue_script( 'foundation', 'https://cdn.jsdelivr.net/g/foundation@5.5.1(js/foundation.min.js+js/vendor/fastclick.js+js/vendor/jquery.cookie.js+js/vendor/jquery.js+js/vendor/modernizr.js+js/vendor/placeholder.js),camanjs@4.1.2', array(), '2.1.3', true );
        // init normalize
        wp_enqueue_style( 'foundation', 'https://cdn.jsdelivr.net/g/foundation@5.5.1(css/normalize.css),fontawesome@4.4.0,animatecss@3.4.0', array(), '', 'all' );
        // init app.min.js
        wp_enqueue_script( 'app', get_template_directory_uri() . '/assets/dist/app.min.js', array( 'jquery' ), '', true );
        // init app.min.css
        wp_enqueue_style( 'app', get_template_directory_uri() . '/assets/dist/app.min.css', array(), '', 'all' );
        // init style.css
        wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css', array(), '', 'all' );

        // init comment reply ...
        if ( is_singular() AND comments_open() AND (get_option('thread_comments') == 1)) {
            wp_enqueue_script( 'comment-reply' );
        }

    }

}

// init source_enqueue() ...
// - - - - - - - - - - - - - - - - -
add_action( 'init', 'source_enqueue' , 999 );

My app.js:

$.noConflict();
$(document).foundation();

I have tried wrapping it in different functions to no avail:

jQuery(document).ready(function(){
    jQuery(document).foundation();
});

or:

$(document).ready(function(){
    $(document).foundation();
});

Nothing works. The error still remains: $ is not a function.

Someone help me solve this once and for all before I go mad and throw my nice desktop into a woodchipper?

回答1:

I found the answer, after years of digging, testing, and trials. I decided to give this one last shot and it worked. No errors, and the console registers foundation. To all those who have struggled, this is the code that will let your enqueue'd foundation script work properly. I'll even provide the CDN.

requires 2 days before I can accept my own answer.

enqueue.php / functions.php, however you require your functions:

// enqueue.php or functions.php
wp_enqueue_script( 'foundation', 'https://cdn.jsdelivr.net/g/foundation@5.5.3(js/foundation.min.js+js/vendor/jquery.js+js/vendor/modernizr.js),scrollreveal.js@0.1.2', array(), '', true );

app.js:

// app.js
$ = jQuery.noConflict( true );

(function( $ ) {
    $(document).foundation();
    // other code here ...
})(jQuery);

回答2:

Why do you enqueu 'jquery'. jQuery is always enqueue by Wordpress.

Remove wp_enqueue_script( 'jquery' );

And in your js file

jQuery(document).ready(function($){
    //then $ works
    // your code
});

回答3:

Just add jQuery.js or jQuery-min library and try this:

     $k = jQuery.noConflict();
     $k(document).ready(function(){
         //then $ works
         // your code
     });

回答4:

"include" standard jquery url in top of the page...

来源：https://stackoverflow.com/questions/33238691/wordpress-enqueue-noconflict-error-not-a-function

标签

javascript

php

jquery

wordpress

zurb-foundation-5