wp_default_script_modules()


WordPressの関数wp_default_script_modules()は、スクリプトのモジュールタイプを設定するために使用されます。主にテーマやプラグイン開発者が、特定のスクリプトをES Modulesとして登録したい場合に役立ちます。

シンタックス

wp_default_script_modules();

この関数は引数を受け取らず、通常はwp_register_script()wp_enqueue_script()と組み合わせて使用されます。

例1: デフォルトのスクリプトモジュールを登録

以下のコードはデフォルトのスクリプトモジュールを登録します。

add_action( 'wp_default_script_modules', function() {
    wp_register_script( 'my-module-script', get_template_directory_uri() . '/js/my-module.js', [], null, true );
});

例2: モジュールスクリプトの自動設定

デフォルトのスクリプトをtype="module"に設定します。

add_action( 'wp_default_script_modules', function() {
    wp_script_add_data( 'my-module-script', 'type', 'module' );
});

例3: 複数のモジュールスクリプトを登録

複数のモジュールスクリプトを登録し、モジュールとして指定します。

add_action( 'wp_default_script_modules', function() {
    wp_register_script( 'module-one', get_template_directory_uri() . '/js/module-one.js', [], null, true );
    wp_register_script( 'module-two', get_template_directory_uri() . '/js/module-two.js', [], null, true );
    wp_script_add_data( 'module-one', 'type', 'module' );
    wp_script_add_data( 'module-two', 'type', 'module' );
});

例4: 条件付きでモジュールスクリプトを追加

特定のページでのみモジュールスクリプトを登録します。

add_action( 'wp_default_script_modules', function() {
    if ( is_page( 'custom-page' ) ) {
        wp_register_script( 'conditional-module', get_template_directory_uri() . '/js/conditional.js', [], null, true );
        wp_script_add_data( 'conditional-module', 'type', 'module' );
    }
});

例5: プラグイン用のモジュールスクリプト設定

プラグインで使用されるスクリプトをモジュールとして登録します。

add_action( 'wp_default_script_modules', function() {
    wp_register_script( 'plugin-module-script', plugins_url( 'js/plugin-module.js', __FILE__ ), [], null, true );
    wp_script_add_data( 'plugin-module-script', 'type', 'module' );
});

注意事項

  • wp_default_script_modules()はスクリプトのtype="module"を適切に設定するために使用されます。
  • この関数を使用する際は、スクリプトの依存関係やロード順序を正しく管理する必要があります。