HighlightJS在WordPress中没有突出显示

Question

Unfortunately, HighlightJS not highlighting my code in WordPress site. The highlightJS background shows, but the syntax isn't highlighting.

Here's the following code:

class WordPress_Code_Highlighter {

    public function __construct() {
        add_action( 'wp_enqueue_scripts', [ $this, 'register_styles' ], 15 );
        add_action( 'wp_enqueue_scripts', [ $this, 'register_scripts' ] );
    }

    public function register_styles() {
        wp_register_style( 'wordpress-code-highlighter', plugin_dir_url( __FILE__ ) . 'bower_components/highlight.js/src/styles/dracula.css', [ ], '9.3.0' );
        wp_enqueue_style( 'wordpress-code-highlighter' );
    }

    public function register_scripts() {
        wp_register_script( 'wordpress-code-highlight', plugin_dir_url( __FILE__ ) . 'bower_components/highlight.js/src/highlight.js', [ ], '9.3.0', true );
        wp_enqueue_script( 'wordpress-code-highlight' );

        wp_register_script( 'wordpress-code-highlighter', plugin_dir_url( __FILE__ ) . 'resources/assets/js/wordpress-code-highlighter.js', [ ], '1.0', true );
        wp_enqueue_script( 'wordpress-code-highlighter' );
    }
}

new WordPress_Code_Highlighter();

Here's the Javascript.

jQuery(document).ready(function () {
    jQuery('pre code').each(function (i, block) {
        hljs.highlightBlock(block);
    });
});

For your convenience, I also attached a screenshot.