There are two recommended methods of loading Async Alpine. Adding a
script tag with a CDN or importing it into your bundle with npm.
Which method you use will depend on how you prefer to use and import Alpine.js.
Content Delivery NetworkPermalink to “Content Delivery Network”
If you load Alpine from a CDN like jsdelivr with a script tag you can load Async Alpine via the same method:
<script defer src="https://email@example.com/dist/async-alpine.script.js"></script>
<script defer src="https://firstname.lastname@example.org/dist/cdn.min.js"></script>
When loading via this method you need to make sure that Async Alpine loads first. This is generally done by including the
script tag for Async Alpine before Alpine. Watch out if you use
async on your script tags.
Install from npm with:
npm install async-alpine
Import it into your bundle alongside Alpine and run
import AsyncAlpine from 'async-alpine';
import Alpine from 'alpinejs';