Alpine.js accepts a custom prefix for directives

Alpine.js uses the x- prefix for directives by default (e.g. x-if). This prefix can be customized using Alpine.prefix().

Alpine.prefix("xyz-"); // Define your custom prefix
Alpine.start();

<!-- Use your custom prefix for all directives -->
<template xyz-if="user">
  <a xyz-bind:href="user.profileUrl" xyz-text="user.name"></a>
</template>

This can be useful to prevent clashes when integrating Alpine into existing apps / markup or to get valid HTML markup that passes the W3C validator by using data-x- as prefix.