Client-Side JavaScript in Astro

<!-- src/components/Example.astro -->

<!-- relative path to script at `src/scripts/example.js` -->
<script src="../scripts/example.js"></script>

The processed script will be injected at where it’s declared with type="module".
- async and defer attributes are unnecessary. Module scripts are always deferred.
Rendering is not blocked. The browser continues to process the rest of the HTML while the module script and its dependencies load.
The browser waits for HTML to be processed before executing module scripts. You do not need to listen for the “load” event.
If your component is used several times on a page, the script will only be included once.

Further reading