@ is not a valid character within a HTML attribute name, therefore when we try and rename ax-@click back to @click we get the below error.
Uncaught DOMException: Failed to execute 'setAttribute' on 'Element': 'ax-@click' is not a valid attribute name.
I can't think of any way around this and restore @click directly, but we could transform into the x-on: pattern in order to preserve functionality. For example:
<!-- source html -->
<div @resize.window="">
<!-- after Async Alpine inits and before component enabled -->
<div ax-@resize.window="">
<!-- OR -->
<div ax-x-on:resize.window="">
<!-- after component initialisation -->
<div x-on:resize.window="">
@
is not a valid character within a HTML attribute name, therefore when we try and renameax-@click
back to@click
we get the below error.I can't think of any way around this and restore
@click
directly, but we could transform into thex-on:
pattern in order to preserve functionality. For example: