How to defer block.json scripts?

Question

I’m currently using wordpress user/scripts, but it puts scripts in HEAD and doesn’t defer them, which often it’s a bad bad thing. I was trying to defer them by doing something like:

// block.json
{
  "name": "alberizanella/counters",
  "title": "Counters",
  "description": "Blocco counters",
  "keywords": ["counters", "counter"],
  "style": [ "file:./counters.css", "counters_style" ],
  "script": [ "file:./counters.js", "counters_js" ],
  "align": "full"
}

and then I would like to add defer prop like this:

if(!is_admin()) add_filter( 'script_loader_tag', 'lr_defer_scripts', 10, 3 );
function lr_defer_scripts( $tag, $handle, $src ) {

  $defer_scripts = array(
    'counters_js'
  );

  if(in_array($handle, $defer_scripts)){ return '<script src="' . $src . '" defer type="text/javascript"></script>' . "\n"; }
  return $tag;
}

But, turns out that this filter seems not to ‘see’ the counters_js $handle. It sees all the other scripts I usually use and defer, but not this one. Seems like passing the counters_js handle to block.json, it’s not recognized by wordpress user/scripts.

0
fuxia 1 month 2023-03-01T15:21:50-05:00 0 Answers 0 views 0

Leave an answer

Browse
Browse