magento2 how to implement graphql with alpine.js get cms static block data

As I replied in your other question here, please go through the official channels to get support for Hyvä. If you have a license you can get support via mail or Slack.

Here is a small example for the usage within a PHTML file. "YourBlockName" should be changed to the respective block.

<script>
   function graphqlGetCms() {
     return {
       result: '',
       loader: '<?= $escaper->escapeHtml(__('Loading...')) ?>',
       query: `{
           cmsBlocks(identifiers: "YourBlockName") {
                 items {
                   identifier
                   title
                   content
                 }
             }
         }`,
       init () {
         window.fetch('/graphql?' + new URLSearchParams({query: this.query}))
           .then(response => response.json())
           .then(result => {
             this.result = result.errors && result.errors.length > 0
               ? result.errors.map(e => e.message).join("n")
               : result.data;
             });
       }
     };
   }
</script>
<div x-data="graphqlGetCms()">
   <template x-if="!result">
      <div x-text="loader"></div>
   </template>
   <template x-if="result">
      <template x-for="block in result.cmsBlocks.items">
         <div x-html="block.content"></div>
      </template>
   </template>
</div>

You can also load multiple blocks with this

cmsBlocks(identifiers: ["YourBlockName","YourBlockName2"])

This is only a functional example

In some cases it may also be necessary to apply contentUpdated within the template. For example, when a jquery ajax add to cart is used.

<script>    
   require(['jquery'], function($) {
        $('body').trigger('contentUpdated');
   });  
</script> 

You can check this theme, they use alpineJS and GraphQl https://github.com/hyva-themes

Learn from the code and apply into your project.

https://docs.hyva.io/