Rollup import

[stuta]

Error using rollup (webpack works):

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

[!] Error: 'Container' is not exported by node_modules/vue-smooth-dnd/dist/vue-smooth-dnd.js
https://github.com/rollup/rollup/wiki/Troubleshooting#name-is-not-exported-by-module

[stuta]

If I do this:

import Container from 'vue-smooth-dnd/src/Container.vue'
import Draggable from 'vue-smooth-dnd/src/Draggable.vue'

1!] Error: 'dropHandlers' is not exported by node_modules/smooth-dnd/dist/index.js

[stuta]

Better error message with link to explanation:

[!] Error: 'dropHandlers' is not exported by node_modules/smooth-dnd/dist/index.js
https://github.com/rollup/rollup/wiki/Troubleshooting#name-is-not-exported-by-module
node_modules/vue-smooth-dnd/src/Container.vue?rollup-plugin-vue=script.js (2:20)

[stuta]

I found a simple way to make Rollup to work. These are tiny changes, it would be nice to have them in the next version.

In vue-smooth-dnd/src/Container.vue change:

import SmoothDnD, { dropHandlers } from 'smooth-dnd';

to

import SmoothDnD from 'smooth-dnd';
import * as dropHandlers from 'smooth-dnd/src/dropHandlers';

In vue-smooth-dnd/src/Draggable.vue change:

import { constants } from "smooth-dnd";

to

import * as constants from 'smooth-dnd/src/constants';

[stuta]

Hmm, I think this is issue in generating dist/vue-smooth-dnd.js.

I changed

import SmoothDnD, { dropHandlers } from 'smooth-dnd'
import { constants } from 'smooth-dnd'

to

import SmoothDnD, { dropHandlers } from 'smooth-dnd/index.js'
import { constants } from 'smooth-dnd/index.js'

Now Rollup works. So there is nothing wrong with the original syntax but smooth-dnd/dist/index.js is not good. If I delete smooth-dnd/dist/index.js then everything works without changes.

[z0lo13]

If anyone is looking for solution.

namedExports: {
			'node_modules/smooth-dnd/dist/index.js': ['smoothDnD', 'dropHandlers', 'constants'], // Explicit named exports
		},

in your rollup config.