error with node_module script when deploying to cloudflare

[jovial totem]

I'm deploying my static astro site to cloudflare pages, and am getting this error in the browser in the prod version of it:

mobile/:1 Refused to execute script from 'https://[root_url]/node_modules/flyonui/flyonui.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

this is the relevant code from the Layout.astro file:

<script
  is:inline
  data-astro-rerun
  src="../../../node_modules/flyonui/flyonui.js"></script>

<script>
  document.addEventListener('astro:page-load', () => {
    setTimeout(() => {
      if (
        window.HSStaticMethods &&
        typeof window.HSStaticMethods.autoInit === 'function'
      ) {
        window.HSStaticMethods.autoInit();
      }
    }, 100);
  });
</script>

The second one was to fix the script not getting reinitialized when doing a page transition, just fyi.

[mighty sparrow]

What is it you’re trying to achieve here? If you have something installed in node modules you can import it into an Astro script like normal as they are all given type module under the hood

[jovial totem]

I'm following the library's instructions for how to set this up. It's a tailwind utility library: https://flyonui.com/framework-integrations/astro/

[mighty sparrow]

I see, I haven’t used that particular library myself but it seems like you are doing what it is asking

Did you add the prerequisites to your tailwind config?

[jovial totem]

Yup did that as well. I just don't really know what the MIME issue is all about.

[jovial totem]

Looks like the prod version of the astro build that is in the dist folder never actually got the script pulled in from node_modules. So I copied the script into my public/js folder and set the script tag to be <script is:inline src="/js/flyonui.js"></script> and reran the deployment and it's working great now.

[mighty sparrow]

I did see that 😄 glad its working and thank you for sharing that here as well in case anyone finds this post in the future and has a similar issue 🙂