How can i use rive-canvas in vue + quasar?

[Guilherme M O]

Is there any way to add rive-canvas to a vue.js + quasar project? I’m doing something wrong.

I’m trying to integrate rive animations in a project, but I’m having problems doing it, more specifically when using the Rive function to render the animation, the error that returns is the declaration of the Rive variable, which I call in this excerpt:

     Rive ({                                                                                    
       locateFile: (file) => 'https://unpkg.com/rive-canvas@0.6.10/' + file, 
     }). then ((rive) => {
     ...
     ...
     ...

And the error that returns:

[Vue warn]: Error in mounted hook: “ReferenceError: Rive is not defined”

Has anyone messed with this, or know how to help me?

Thanks!

[dobbel]

@guilherme-m-o

1. yarn add install rive-canvas

2. the code below

import Rive from "rive-canvas"
....
mounted() {
    console.log("############ mounted #############")
    Rive({
      locateFile: file => "https://unpkg.com/rive-canvas@0.6.10/" + file,
    }).then(rive=> {
      console.log(rive)
      // output: "some rive promise!"
    })
},

That looks like a really interesting animation repo. If you create something with Quasar and Rive would you be so kind to share what you did here on the forum?