Реинициализация скриптов страницы после изменения страницы SmoothState.Js

Я использую SmoothState.js для переходов страниц, и он отлично работает и загружает новые страницы с помощью ajax. Тем не менее, у меня есть JS-скрипты на каждой странице, которые нужно переинициализировать, и я не смог заставить их всегда присутствовать при переходах страниц.

На основании FAQ:

smoothState.js предоставляет функцию обратного вызова onAfter, которая позволяет вам повторно запускать ваши плагины. Это может быть сложно, если вы не знакомы с тем, как работает AJAX.

Когда вы запускаете плагин для $ (document) .ready (), он будет регистрироваться только для элементов, которые в данный момент находятся на странице. Поскольку мы внедряем новые элементы при каждой загрузке, нам нужно снова запускать плагины, ограничивая их новыми элементами.

Хороший способ сделать это - обернуть инициализации вашего плагина в функцию, которую мы вызываем как для $ .fn.ready (), так и для onAfter. Вы захотите указывать контекст каждый раз, когда инициализируете плагины, чтобы не связывать их дважды. Это называется «контроллером выполнения модуля».

Мой план состоял в том, чтобы взять функции из моих файлов JS и поместить их все в вызов onAfter внутри файла SmoothState.js. Таким образом, каждый раз, когда пользователь меняет страницу, функции всегда будут доступны.

Вот структура кода у меня сейчас. Я много копал, но застрял. Можете ли вы помочь мне понять, что я делаю неправильно? Спасибо за ваше время!

$(document).ready(function() {
    mail();

});

$('#main').smoothState({
    onAfter: function() {
        mail();
    }
});

function mail() {
    // script from mail.js goes here
}

$(function() {
    $('#main').smoothState();
});

$(function() {
    "use strict";
    var options = {
            prefetch: true,
            pageCacheSize: 3,
            onStart: {
                duration: 250, // Duration of our animation 
                render: function($container) {
                    // Add your CSS animation reversing class 

                    $container.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);


                }

            },

        },
        smoothState = $("#main").smoothState(options).data("smoothState");
});