How to import api-fetch for a POST request?

• Tahoe

• November 24, 2021 at 10:01 am

Hi!

I’m trying to use the new REST API integration of ACF to make a POST request, but I can’t get it to work because I always get errors when importing api-fetch.

What I did:
– ran npm init on my WordPress installation
– then ran npm install @wordpress/api-fetch --save

Then, here’s what I put in functions.php of my theme:

function my_acf_admin_head() { ?>

    <script type="module">

        import apiFetch from '../../../node_modules/@wordpress/api-fetch'';

        // POST
        apiFetch( {
        path: '/wp/v2/book/{ID}',
        method: 'POST',
        data: {
            "acf": {
                "author": "Abraham (Abe) Simpson",
            }
        },
        } ).then( ( res ) => {
            console.log( res );
        } );
        
    </script>
<?php }
	
add_action('acf/input/admin_head', 'my_acf_admin_head');

Here’s the error I get:
Loading module from “https://mysite.com/node_modules/@wordpress/api-fetch/” was blocked because of a disallowed MIME type (“text/html”).

I tried a few other things but they all end up making errors as well. I’m familiar with NPM, but I’ve never used it with WordPress before. However I can’t find much online about this problem, the only thing people seem to say is to use type="module", but I’m still getting problems with it.

Any help would be appreciated, thank you 🙂