你可以试试这段代码，并添加你的JS模块来创建运费计算器。

/**
 * Add custom field to the checkout page
 */
add_action( 'woocommerce_after_order_notes', function ( $checkout ) {
    echo '<div id="custom_checkout_field"><h2>' . __( 'Order Meta' ) . '</h2>';
    woocommerce_form_field( 'custom_shipping_cost',
        array(
            'type'  => 'number',
            'required'  => true,
            'label' => __( 'Custom Shipping Cost' ),
        ),
        $checkout->get_value( 'custom_shipping_cost' )
    );
    woocommerce_form_field( 'custom_shipping_date',
        array(
            'type'  => 'date',
            'required'  => true,
            'label' => __( 'Custom Shipping Date' ),
        ),
        $checkout->get_value( 'custom_shipping_date' )
    );
    echo '</div>';
} );

/**
 * Checkout Process
 */
add_action( 'woocommerce_checkout_process', 'customised_checkout_field_process' );
function customised_checkout_field_process() {
    if ( ! $_POST['custom_shipping_cost'] ) {
        wc_add_notice( __( 'Please enter cost!' ), 'error' );
    }
    
    if ( ! $_POST['custom_shipping_date'] ) {
        wc_add_notice( __( 'Please enter date!' ), 'error' );
    }
}

/**
 * Update the value given in custom field
 */
add_action( 'woocommerce_checkout_update_order_meta', 'custom_checkout_field_update_order_meta' );
function custom_checkout_field_update_order_meta( $order_id ) {
    if ( ! empty( $_POST['custom_shipping_cost'] ) ) {
        update_post_meta( $order_id, 'custom_shipping_cost', sanitize_text_field( $_POST['custom_shipping_cost'] ) );
    }
    
    if ( ! empty( $_POST['custom_shipping_date'] ) ) {
        update_post_meta( $order_id, 'custom_shipping_date', sanitize_text_field( $_POST['custom_shipping_date'] ) );
    }
}