How to use in Quasar (building an Electron app) ?

  • Hi everybody.
    Quasar Framework is something brand new to me, so I hope I’m able to question this in a manner that makes some sense.

    I’m building a desktop app, migrating from Nuxt to Quasar for two reasons: the in-house support that Quasar offers to build Electron apps, and some unnecessary complications - for my specific case - related to Nuxt (which is great, don’t get me wrong).

    My app is like a chat app for OSC messages, so, its a desktop app with web functionalities.

    In my Nuxt project I had a main.js in the root folder that looks much like this one:

    I’m aware I won’t need all the Electron part of this file in Quasar, but I’m interested in the server part:

    const http = require('http')
    const server = http.createServer(nuxt.render)
    // listen the server
    const _NUXT_URL_ = `http://localhost:${server.address().port}`
    console.log(`Nuxt working on ${_NUXT_URL_}`)

    because then I would be able to bind socketIO to the server like this:

    const socketIO = require('')
    const io = socketIO(server)

    My double question is how could I get/set something like this within Quasar and where in Quasar’s folder structure the file with it should live?


  • HI there!
    I’m not sure if I understand your first question but in terms of where this should all live but I recommend looking into boot files

    You’d run:

    $ quasar new boot <file-name>

    and from there you can have your available in all your pages via:


    so in terms of the file structure of quasar src/boot holds all your plugins

    N.B. this is for v1.0

  • Hi @mKomo
    Thank you for your answer. I was guessing boot files was the way to go.

    There are two flavours of server and client ( The server part of it commonly can be found in a node.js file (usually called “main.js”, “server.js” and even “index.js”), together with Express or whichever js server is used, being ‘http’ the simplest option.

    Doing a quick research in order to better formulate my first question I just found that nuxt.render, used to create the http-server binded to is “a middleware for your node.js server.”. So, maybe the question is: how can I use Quasar as a middleware for my node.js server?

    BTW I’m using v1.0, so its all fine about the boot files.

    I hope I managed to make my question more clear.

    Thanks again


  • @gil
    Glad to hear!
    Unfortunately I don’t think I can offer sound help for you.
    It might be worth asking what you’re trying to achieve?

    For instance if you are using to connect to a back-end service or run a server internally for use with-in your electron app?


  • Hi @mKomo
    Thank you for sticking with me.
    I’m using server internally to get and emit OSC messages to others on the web, like a chat, and to other eventual desktop app in the same machine the app would be installed.

  • @gil
    Ah I see (and correct me if I’m wrong)

    So you’re running an electron app that uses

    And you’ll then be connecting to that local app from other apps and machines on the network


                    Main Electron App (server)
                     /           |            \
                   /             |              \
                 App            App.            App        

    I’m not sure what’s an efficient way to go about doing this, as I haven’t played around with electron before, but I’ll look into it further as this sounds pretty interesting

    Feel free to contact me if you come up with a solution and I’ll see what I manage to come up with

  • @mKomo

    That’s it. Actually all apps are clients and servers at the same time as they receive and send messages in real time.

    I’m making it with Electron because web-browsers don’t have the permissions to communicate with other apps in the way I need.

    In the meanwhile I tried to make a boot file with this (now trying

    import VueSocketIO from ''
    export default async ({ Vue }) => {
      Vue.use(new VueSocketIO({
        debug: true,
        connection: ''

    But hen I’m getting this errors:
    Cross-Origin Read Blocking (CORB) blocked cross-origin response <URL> with MIME type text/html. See <URL> for more details.
    I’m afraid this is not the way to go as I’m trying to do server things on the client side.

    Thank you one more time. If I find a way to solve this I’ll post it here.

  • @gil
    Sounds good, best of luck!

Log in to reply