PHP code example of gebruederheitz / wp-module-scripts

1. Go to this page and download the library: Download gebruederheitz/wp-module-scripts library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php.
    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

    

gebruederheitz / wp-module-scripts example snippets


// functions.php or similar
use GebruederHeitz\Wordpress\ModuleScriptHandler;

// Initialize once so the action can be hooked
ModuleScriptHandler::getInstance();

// The script that has been registered (or enqueued) with the handle
// 'my-legacy-script' will now have the 'nomodule' attribute added to it.
wp_script_add_data('my-legacy-script', 'nomodule', true);
// This will be "type='module'":
wp_script_add_data('my-esm-script', 'type', 'module');


// functions.php or similar
use GebruederHeitz\Wordpress\ModuleScriptHandler;

// Initialize once so the action can be hooked
ModuleScriptHandler::getInstance();

add_action('wp_enqueue_scripts', function() {
    // ModuleScriptHandler is a Singleton, so this will retrieve the instance
    // initialized above
    $handler = ModuleScriptHandler::getInstance();
    // Simple usage: register your hybrid build
    // Paths are passed through `get_theme_file_uri()`
    $handler->register('my-hybrid-script', 'path/to/module.js', 'path/to/nomodule.js');
    
    // Adds cache busting to the nomodule script (because version is supplied),
    // immediately enqueues both scripts, and returns the handles.
    [$moduleHandle, $nomoduleHandle] = $handler->register(
        'my-hybrid-script',
        modulePath: 'js/main.esm.v4.0.1.js',
        nomodulePath: 'js/main.legacy.js',
        dependencies: ['jquery'],
        enqueue: true,
        version: '4.0.1',
    );
});

    [$moduleHandle, $nomoduleHandle] = $handler->register(
        'my-hybrid-script',
        modulePath: 'js/main.esm.v4.0.1.js',
        nomodulePath: 'js/main.legacy.js',
        version: '4.0.1',
    );
    
    wp_localize_script($moduleHandle, 'myData', ['foo' => 'bar']);
    if ($condition) {
        wp_enqueue_script($moduleHandle);
    }

    // You can also register/enqueue only a module script by passing only the
    // modulePath...
    [$moduleHandle, $nomoduleHandle] = $handler->register(
        'my-module-only-script',
        modulePath: 'js/main.esm.v4.0.1.js',
        version: '4.0.1',
        enqueue: true,
    );
    
    // ...or a "generic" script with no special attributes whatsoever.
    [$moduleHandle, $nomoduleHandle] = $handler->register(
        'my-generic-script',
        nomodulePath: 'js/main.js',
        version: '4.0.1',
        enqueue: true,
    );