Uncaught ReferenceError: jQuery is not defined

[wpsumo]

Only me with this issue? https://tppr.me/ZFhb5

/perf-cgi/3pp/https/ajax.cloudflare.com/cdn-cgi/scripts/95c75768/cloudflare-static/rocket-loader.min.js

[wpsumo]

It seems like defer jQuery together with rocket loader in the streamer doesn't play nicely with each other. For now, I have to keep the jQuery to be render-blocking.

Anyone experience the same issue or have a solution?

[ashleymichal]

i'm not certain exactly what you are trying to do, or where the error is being thrown, or the connection to a worker example. can you please give us a little more information?

[wpsumo]

Thrown Jquery not defined in the console once I defer jquery on the wordpress application.

[xtuc]

@alriksson could you please share the website where we can reproduce the issue?

[wpsumo]

I have to keep the jQuery as render-blocking since it breaks the js rendering. I do not have it live to show.

If you just defer the jquery in Wordpress with he streamer worker you will see this. Happened to all sites I run the streamer on and deferred jQuery. So guess you easily could replicate this on your side.

Maybe I can share another day and traffic is low so I can show you the issue. But prefer to share in non-public threads.

[xtuc]

I would be happy to help if you can send me the repro at sven@cloudflare.com

if you mark a script with data-cfasync="false" RocketLoader will ignore it and not defer it.

[wpsumo]

True!

Maybe you have a better php snippet to run to ignore certain scripts?:

function rocket_loader_attributes_start() {
    ob_start();
}

function rocket_loader_attributes_end() {
    $script_out = ob_get_clean();
    $script_out = str_replace(
      "type='text/javascript' src='{rocket-ignore}", 
      'data-cfasync="false"'." src='", 
      $script_out);  
    print $script_out;
}

function rocket_loader_attributes_mark($url) {
    // Set up which scripts/strings to ignore
    $ignore = array (
        'script1.js'
    );
    //matches only the script file name
    preg_match('/(.*)\?/', $url, $_url);
    if (isset($_url[1]) && substr($_url[1], -3)=='.js') {
      foreach($ignore as $s) {
         if (strpos($_url[1], $s)!==false)
           return "{rocket-ignore}$url";
      }
      return "$url' data-cfasync='true";
    }

    return "$url";

}
if (!is_admin()) {
  add_filter( 'clean_url', 'rocket_loader_attributes_mark', 11, 1);
  add_action( 'wp_print_scripts', 'rocket_loader_attributes_start');
  add_action( 'print_head_scripts', 'rocket_loader_attributes_end');
}

[xtuc]

Could you please confirm that it fixed your issue? So we can close this

[wpsumo]

@xtuc Though I was waiting for your response? Sorry. But at the same time the jquery is one of the heavy parts on Wordpress, something you would prefer to optimize with a tool such as rocket loader from cloudflare.

[simplenotezy]

I have same issue but it's not on every page. In fact I rarely see it myself, but if I look at my bugtracker it happens every now and then. Is the solution to have rocket loader ignore jQuery?

[tomeda]

Guys any clue on how can I make Cloudflare's rocket loader to ignore Wordpress jquery globally?

[lauragift21]

Closing this issue because the templates have moved over to the worker-sdk monorepo: https://github.com/cloudflare/workers-sdk/tree/main/templates.

if you're still experiencing issues feel free to open an issue there.