Using Ray with Vue.js

Vue.js is a progressive JavaScript framework for building user interfaces. Use Ray to help you debug when developing Vue.js applications and components.

permafrost-dev/vue-ray

Installing the package

npm install vue-ray

yarn add vue-ray

Installing the plugin

Vue 3

import { createApp } from 'vue';
import App from './App.vue';
import RayPlugin from 'vue-ray';

const app = createApp(App);

app.use(RayPlugin);

app.mount('#app');

Vue 2

import Vue from 'vue';
import RayPlugin from 'vue-ray';

Vue.use(RayPlugin);

Once the plugin is installed, you can access the helper function as this.$ray() from within your Vue components.

<script>
export default {
    methods: {
        sendToRay() {
            this.$ray('Hello from Vue!');
        }
    }
}
</script>

Usage

All JavaScript methods are available when using Vue.js.

What's next?

Now that Ray is installed in your Vue.js project, see what you can use it for.

Debug without breaking your flow

Ray keeps all your debug output neatly organized in a dedicated desktop app.

Download Ray

Buy Ray for\
434 NOK
Licenses are valid for 1 year and managed through Spatie. Licenses purchased before Ray 3 remain valid. VAT is calculated at checkout.

Stay in the loop with updates & promotions for Ray

The free trial lets you send up to 20 messages per session.