Auto updating JavaScript dependancy in functions.php

If I understood your question correctly, you have two JavaScript files: ads.js and banner.js.

You want the site to load the updated version of both of these files, whenever any of these files are changed.

If this understanding is correct, then you may do the following:

function my_custom_theme_scripts() {
    $ads_version = filemtime( get_stylesheet_directory() . '/js/ads.js' );
    $banners_version = filemtime( get_stylesheet_directory() . '/js/banners.js' );

    wp_enqueue_script(
        'ads',
        get_stylesheet_directory_uri() . '/js/ads.js',
        array(),
        $ads_version,
        true
    );
    wp_enqueue_script(
        'banners',
        get_stylesheet_directory_uri() . '/js/banners.js',
        array( 'ads' ),
        $banners_version,
        true
    );
}
add_action( 'wp_enqueue_scripts', 'my_custom_theme_scripts' );

This way, whenever any of the files are changed, only the updated versions will be loaded in the frontend. When ads.js is changed, but banners.js is unchanged, the same old banners.js will still get the new ads.js, because the new ads.js will be loaded by the $ads_version timestamp. There’s no need to change the dependency handle.

Note: I’ve used get_stylesheet_directory_uri() and get_stylesheet_directory for consistency (for the currently active theme).

Mixing up get_template_directory_uri() and plugin_dir_path() will work in theory, but that sort of inconsistency may break your code in future. plugin_dir_path() is supposed to be used with plugins, and get_template_directory_uri() for the parent theme.


Also, I’ve added:

add_action( 'wp_enqueue_scripts', 'my_custom_theme_scripts' );

Just in case you are missing the wp_enqueue_scripts action hook. The code will not work properly without it.

Of course, if you are already using the action hook properly, like:

add_action( 'wp_enqueue_scripts', '<function-that-enqueues-scripts>' );

then please don’t add it again.

tech