javascript — Smoothstate.js — загрузка определенных таблиц стилей и сценариев через functions.php не работает

Мне интересно, может ли кто-нибудь помочь мне, пожалуйста. В настоящее время я использую плагин Smoothstate.js для перехода между страницами на моем сайте WordPress. Пока плагин прекрасно работает и делает то, что я хочу.

Однако, когда я пытаюсь загрузить отдельные файлы для отдельных страниц через файл functions.php в WordPress, при переходе между страницами некоторые из сценариев не работают.

Я удостоверился, что сценарии загружены в контейнер, чтобы Smoothstate.js знал, какие файлы были добавлены, и я также перезапустил функции, используя функцию onAfter.

Это странно, потому что когда я проверяю DOM после навигации по страницам, я вижу загружаемые скрипты, но потом. Если я проверяю вкладку источников в инструментах разработки, они не отображаются?

Мне нужно иметь возможность специально загружать отдельные файлы в зависимости от того, на какой странице вы находитесь по соображениям производительности, поэтому я надеюсь, что есть способ сделать это, не вступая в конфликт с Smoothstate.js. Кто-нибудь имеет какой-либо опыт с этим или знает ответ?

Моя установка выглядит так:

functions.php

Как видите, я хочу, чтобы карты Google загружались только на странице контактов.

  wp_enqueue_script( 'anime-script', get_stylesheet_directory_uri() . '/js/anime.min.js', array(), $the_theme->get( 'Version' ), true);
wp_enqueue_script( 'scrollMonitor-script', get_stylesheet_directory_uri() . '/js/scrollMonitor.js', array(), $the_theme->get( 'Version' ), true);
wp_enqueue_script( 'scroll-scripts', get_stylesheet_directory_uri() . '/js/scrollreveal.js', array(), $the_theme->get( 'Version' ), true );
wp_enqueue_script( 'type-script', get_stylesheet_directory_uri() . '/js/typed.min.js', array(), $the_theme->get( 'Version' ), true);

if(is_page('contact-us')) {
wp_enqueue_script( 'google-maps', 'https://maps.googleapis.com/maps/api/js?key=AIzaSyC5_sL4wf3GIEgwI7bUXWD4pqkkc8er7tQ', array(), $the_theme->get('Version'), true);
wp_enqueue_script( 'google-maps-settings', get_stylesheet_directory_uri() . '/js/google-maps.js', array(), $the_theme->get( 'Version' ), true);
wp_enqueue_script( 'contact-slider', get_stylesheet_directory_uri() . '/js/contact-slider.js', array(), $the_theme->get( 'Version' ), true);
}

Smoothstate JS

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

function init() {
ImageSliders();
navbarColour();
typedBanners();
scrollingAnimations();
navBarHide();
animateOnLoadPosition();
openSubscribePanel();
};

$(document).ready(function() {
'use strict';

addBlacklistClass();

// Init here.
var $body = $('body'),
$main = $('#page'),
$site = $('html, body'),
transition = 'fade'


var options = {
prefetch: true,
cacheLength: 2,
debug: true,
blacklist: '.wp-link, .open-panel-link',

onBefore: function($anchor, $container) {
var current = $('[data-viewport]').first().data('viewport'),
target = $anchor.data('target');
current = current ? current : 0;
target = target ? target : 0;
if (current === target) {
transition = 'fade';
} else if (current < target) {
transition = 'grow';
} else {
transition = 'moveleft';
}

var highResImageUrl = $anchor.find('.thumbnail-holder').data('src');
var thumbnailholder = $anchor.find('.thumbnail-holder');
var newImage = $anchor.closest('.thumbnail-wrapper').append('<img class="imageGrow" src="' + highResImageUrl + '">');
},

onStart: {
duration: 1200, // Duration of our animation
render: function (url, $container) {
// Add your CSS animation reversing class
$main.attr('data-transition', transition);
$main.addClass('is-exiting');

// Restart your animation
smoothState.restartCSSAnimations();
}
},
onReady: {
duration: 0,
render: function ($container, $newContent) {
// Remove your CSS animation reversing class
$container.removeClass('is-exiting');

// Inject the new content
$container.html($newContent);
}
},
onAfter: function() {

init();
addBlacklistClass();

if (typeof contactSliderUI == 'function') {
contactSliderUI();
}

$('.acf-map').each(function() {
// create map
map = new_map( $(this) );
});


var $hash = $( window.location.hash );

if ( $hash.length !== 0 ) {

var offsetTop = $hash.offset().top;

$( 'body, html' ).animate( {
scrollTop: ( offsetTop - 60 ),
}, {
duration: 280
} );
}
}
},
smoothState = $('#page').smoothState(options).data('smoothState');
});