You can send information from Alpine.js to Ray via this third party package:


#Installation via CDN

The preferred way to use this package is to load it via a CDN. You'll need to load the axios library as well.

For Alpine version 2 use:

<script src=""></script>
<script src=""></script>

<!-- load alpine.js here -->

For Alpine version 3 use:

<script src=""></script>
<script src=""></script>

You can also configure aspects of Alpine by creating a config object before loading the Alpine Ray library:

    window.alpineRayConfig = {
        logComponentsInit: true,
        logErrors: true,
        logEvents: ['abc'],

<!-- load axios and alpinejs-ray -->

#Installation with package manager

Install with npm:

npm install alpinejs-ray

#Importing the plugin

Although not the recommended way, you can import package normally if installed with a package manager (along with alpinejs and axios):

First, install alpinejs-ray with npm (or your preferred package manager):

npm install alpinejs-ray
import Alpine from 'alpinejs';
import AlpineRayPlugin from 'alpinejs-ray';

window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

window.Alpine = Alpine;


On this page

Help us improve this page