How can i use Drag and drop plugins in Nuxt.js?

Question

I am looking for a tutorial that teaches me how to implement the drag and drop effect like Vue-draggable smooth-dnd in a project of Nuxtjs. For styling, I am using Tailwind CSS.

Answer 1

If you're looking into smooth drag&drop, you can install the vue-smooth-dnd package by going through nuxt plugins.

// nuxt.config.js
module.exports = {
  plugins: ['~/plugins/vue-smooth-dnd.js']
}

That way, it could then be used exactly as show in the docs.

---

EDIT

Actually, it looks like you can directly use it as (in your .vue component)

import { Container, Draggable } from "vue-smooth-dnd"

With no more configuration needed. It will be scoped per component and will not explode size-wise.