In Vue.js 3 Composition API with WebSockets. Where should I create the instance of Laravel Echo and Pusher?

I am using WebSockets in the backend and I need to know where I should instantiate the Laravel Echo and Pusher libraries applying good practices. Should I instantiate them in the main.js file or should I create another file in a specific directory and import it? (My intention is to apply best practices, I then want to make a progress bar for uploading files.).

I understand that this is the way:

`
import Echo from ‘laravel-echo’;
import Pusher from ‘pusher-js’;

window.Echo = new Echo({
broadcaster: ‘pusher’,
key: process.env.MIX_PUSHER_APP_KEY,
cluster: process.env.MIX_PUSHER_APP_CLUSTER,
encrypted: true,
authEndpoint: ‘/broadcasting/auth’,
auth: {
headers: {
‘X-CSRF-TOKEN’: $(‘meta[name=”csrf-token”]’).attr(‘content’)
}
}
});
`