kutlugsahin / vue-smooth-dnd

Vue wrapper components for smooth-dnd
MIT License
1.73k stars 250 forks source link

Rollup import #32

Open stuta opened 6 years ago

stuta commented 6 years ago

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 commented 6 years ago

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 commented 6 years ago

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 commented 6 years ago

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 commented 6 years ago

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 commented 11 months ago

If anyone is looking for solution.

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

in your rollup config.