Laravel Vite集成Alpine.js异常：Uncaught ReferenceError: Alpine未定义

问题根源 #

app.js中的代码顺序错误：先执行Alpine.start()，再将Alpine挂载到window对象。Alpine.start()会立即触发alpine:init事件，此时window.Alpine尚未完成赋值，因此事件回调内访问全局Alpine变量会抛出未定义错误。而事件回调执行完毕后，window.Alpine = Alpine才会执行，所以后续在控制台输入Alpine能正常访问到该对象。

修复代码 #

调整代码顺序，先把Alpine挂载到全局，再启动Alpine：

import Alpine from 'alpinejs';

window.Alpine = Alpine;
Alpine.start();

额外说明 #

若页面内脚本放置在@vite('resources/js/app.js')之前，需确保脚本在Vite模块加载完成后执行，但当前场景中alpine:init已正常触发，说明脚本执行时机无问题，核心矛盾仅为window.Alpine的赋值顺序。

内容的提问来源于stack exchange，提问作者Vinze