No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Vue Clipboard-2 Installation on Quasar 1.0

    Help
    2
    3
    536
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • J
      Julia last edited by

      Has anybody been able to make this popular Vue Clipboard2
      plugin work for Quasar v.1? All the instructions explain how to install it by editing main.js, but Quasar 1.0 doesn’t have main.js anymore. So, I’ve tried to adapt the old installation instructions to the new boot files instructions as follows:

      // $ quasar new boot VueClipboard
      
      // Then in the boot/VueClipboard.js file:
      
      import VueClipboard from 'vue-clipboard2';
      
      export default async ({ Vue }) => {
        Vue.prototype.$VueClipboard = VueClipboard;
      };
      
      // Then in quasar.conf.js
      
      boot: [ // Boot files are pulled from the boot folder.
            "axios",
            "VueClipboard"
          ]
      

      Everything seems to be installed fine because my app loads without any compile-time errors, but when I try to use the plugin with the v-clipboard:copy directive in my template, the plugin doesn’t work and I always get this error:

      Failed to resolve directive: clipboard.

      I also tried using a similar plugin, but I got the same error. So, I’m wondering if there is a problem within the new Quasar plugin system or if I’m just not installing the plugins correctly.

      Can somebody please help?

      1 Reply Last reply Reply Quote 0
      • metalsadman
        metalsadman last edited by

        @Julia try

        import VueClipboard from 'vue-clipboard2';
        
        export default async ({ Vue }) => {
          Vue.use(VueClipboard)
        };
        
        1 Reply Last reply Reply Quote 0
        • J
          Julia last edited by

          I tried that previously and got some other error, but I just tried it again and it worked. I guess when I tried it before there was some other co-existing config problem.

          Anyway, that resolves the problem. Thank you very much for your help!

          1 Reply Last reply Reply Quote 1
          • First post
            Last post