[bug] Attempted import error: 'MultiDrag' is not exported from 'sortablejs' #179

icflorescu · 2020-09-25T11:08:44Z

Describe the bug
Getting this error in a Next.js application since v5 was released:

error - ./node_modules/react-sortablejs/dist/index.es.js
Attempted import error: 'MultiDrag' is not exported from 'sortablejs'.

Information
This is required. Issues without this critical information will be closed.

Versions:
react-sortable = ^5.0.4
react = 16.13.1

The only thing that works for me is freezing react-sortable version to 2.0.11 exactly.

The text was updated successfully, but these errors were encountered:

waynevanson · 2020-09-25T13:59:19Z

sortablejs is a peer dependency. Please download it and let me know how you go.

If it doesn't work, please let me know, freeze it and I'll try get it sorted.

waynevanson · 2020-09-25T14:11:36Z

related to #178

Holenvik · 2020-09-25T14:15:38Z

sortablejs is a peer dependency. Please download it and let me know how you go.

If it doesn't work, please let me know, freeze it and I'll try get it sorted.

Hi, it doesn't work

sagar1596 · 2020-09-25T14:32:30Z

Freezing the version works for me but I'm going back from a 5.x to a 2.x version and might miss many bug fixes and features.
Thank you guys for the responsiveness and looking forward to a fix 😊

waynevanson · 2020-09-25T14:51:03Z

Remove any code that mounts the multidrag plugin and see if it works.

It looks like module in the package.json for sortablejs mounts the plugin and therefore doesn't export it.
https://github.com/SortableJS/Sortable/blob/master/packages/sortablejs/src/modular-complete.ts

going back from a 5.x to a 2.x version and might miss many bug fixes and features

You haven't missed much, we wentfrom v2 to v5 in a day because I was adding semantic-release via github actions.

Eric-Juquel · 2020-09-25T14:52:29Z

same issue , any solution ?

waynevanson · 2020-09-25T15:44:29Z

Read the migration guide for further guidance.

@Eric-Juquel did you try what I said?

icflorescu · 2020-09-25T16:18:57Z

@waynevanson - I knew about sortablejs being a peer dependency, I had it installed and that wasn't the cause of the error.

Edit: I'm not even using MultiDrag, just doing this:

import { MultiDrag } from 'sortablejs';
...
<ReactSortable className={classes.photos} list={photos} setList={handleSort}>
  {photoComponents}
</ReactSortable>
...

I did some more tests and found out that "react-sortablejs": "^5.0.5" doesn't throw the error if I freeze sortablejs to 1.10.1 or 1.10.2 exactly (1.10.0 won't work with Next.js due to SortableJS/Sortable#1638). Which leads me to believe this must be related to a change in latest sortablejs (currently 1.12.0)...

Are you absolutely sure you've updated your local deps before testing?
I see ^1.10.0 here: https://github.com/SortableJS/react-sortablejs/blob/master/package.json#L76

dagreatbrendino · 2020-09-25T19:59:39Z

having this same issue on a staging build but not on local

edit: realized it was working locally because it was on version 2.x and staging build was on 5.x .
after upgrading locally to 5.0.5 I followed @icflorescu steps and locked sortablejs at 1.10.2 and it seems to be working again locally and on staging site.

waynevanson · 2020-09-26T02:51:03Z

@icflorescu It looks like the typescript typings are out of date and that us exporting the plugins is a bug.

BREAKING CHANGE: it's apparent we're import sortablejs with all plugins mounted. We've had a few bugs come in that MultiDrag no longer exports because of version 1.12.x of sortablejs making an accidental breaking change. fix #179

# [6.0.0](v5.0.5...v6.0.0) (2020-09-27) ### Bug Fixes * **types:** removes MultiDrag and Swap exports from index ([f34c861](f34c861)), closes [#179](#179) ### Build System * **parcel:** replace rollup with parcel 2 ([3876be2](3876be2)) ### BREAKING CHANGES * **parcel:** packagejson#module was removed because the file is no longer being generated. * **types:** it's apparent we're import sortablejs with all plugins mounted. We've had a few bugs come in that MultiDrag no longer exports because of version 1.12.x of sortablejs making an accidental breaking change.

github-actions · 2020-09-27T14:13:23Z

🎉 This issue has been resolved in version 6.0.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

JUNNNI · 2020-09-27T19:50:41Z

I confirm that it's working now, thanks ! 🎉

icflorescu · 2020-09-28T14:31:48Z

Thanks!

himaniChaine · 2020-10-16T20:07:34Z

I am also facing same issue and these solution is not working for me
'Attempted import error: 'MultiDrag' is not exported from 'sortablejs'.'

chundhau · 2020-11-02T00:49:35Z

I installed the latest react-sortablejs (6.14.6) but am still getting this error. Can you please confirm the sequence of steps necessary to remove the error 'Attempted import error: 'MultiDrag' is not exported from 'sortablejs'. Thanks!

Ciriak · 2020-11-09T13:31:30Z

Same issue here after a yarn upgrade :/

littlee · 2020-12-13T09:46:59Z

Same issue here

"react-sortablejs": "^6.0.0",
"sortablejs": "^1.12.0",

BUT

I found that when using react-sortablejs, we don't have to mount the plugin, adding multiDrag with nothing else just works

import ReactSortable from 'react-sortablejs';

// ...
<ReactSortable   multiDrag /*...*/ />

# [6.0.0](SortableJS/react-sortablejs@v5.0.5...v6.0.0) (2020-09-27) ### Bug Fixes * **types:** removes MultiDrag and Swap exports from index ([f34c861](SortableJS/react-sortablejs@f34c861)), closes [#179](SortableJS/react-sortablejs#179) ### Build System * **parcel:** replace rollup with parcel 2 ([3876be2](SortableJS/react-sortablejs@3876be2)) ### BREAKING CHANGES * **parcel:** packagejson#module was removed because the file is no longer being generated. * **types:** it's apparent we're import sortablejs with all plugins mounted. We've had a few bugs come in that MultiDrag no longer exports because of version 1.12.x of sortablejs making an accidental breaking change.

ArturoTorresMartinez · 2023-03-29T16:44:09Z

This is still an issue

# 1.0.0 (2024-11-15) ### Bug Fixes * **react-sortable.jsx:** const newList = [...props.list].map((item) => ([c945c6d](c945c6d)) * allow update disabled prop at runtime ([dccdd24](dccdd24)) * fix package versions ([b464971](b464971)) * infra ([1d43f97](1d43f97)) * object-assign errors ([fde561e](fde561e)) * passes clone function to onAdd if cloning ([SortableJS#173](https://github.com/kha333n/react-sortablejs/issues/173)) ([5ff3f4a](5ff3f4a)) * preserve original objects ([362cbd5](362cbd5)) * update dependencies ([b8ca5c2](b8ca5c2)) * update dependencies ([8401a8c](8401a8c)) * **react18:** add `children` to `ReactSortableProps` ([f6b4e2e](f6b4e2e)) * spell 'these' incorrectly ([0656825](0656825)) * **ci:** adds dist/** to git assets ([c46913f](c46913f)) * **remove unnecesary devdependencies:** rmeove innecesary devDependencies ([1000f68](1000f68)) * **semantic:** adds missing github plugin ([f6a7cca](f6a7cca)) * **semantic:** use dist/** glob ([76d1ba0](76d1ba0)) * **semantic:** uses dist/**.* to assets ([6aa4183](6aa4183)) * **types:** removes MultiDrag and Swap exports from index ([f34c861](f34c861)), closes [SortableJS#179](https://github.com/kha333n/react-sortablejs/issues/179) * **util.ts:** changes custom type Omit to extend keyof T ([9db7297](9db7297)) ### Build System * **parcel:** replace rollup with parcel 2 ([3876be2](3876be2)) ### Code Refactoring * help ([1cb872e](1cb872e)) ### Continuous Integration * **semantic:** adds plugin @semantic/git ([5f2b28e](5f2b28e)) ### Documentation * ensure sortablejs and @types/sortablejs are peers dependencies ([1686019](1686019)) ### Features * remove and update dependencies ([65fa886](65fa886)) * **deps:** adds sortablejs and @types/sortablejs as peer dependencies ([d8c2ce4](d8c2ce4)), closes [SortableJS#148](https://github.com/kha333n/react-sortablejs/issues/148) * **deps:** adds sortablejs and @types/sortablejs as peer dependencies ([07da8b9](07da8b9)), closes [SortableJS#148](https://github.com/kha333n/react-sortablejs/issues/148) ### Reverts * prettier preserve semicolons ([a658d04](a658d04)) ### BREAKING CHANGES * **parcel:** packagejson#module was removed because the file is no longer being generated. * **types:** it's apparent we're import sortablejs with all plugins mounted. We've had a few bugs come in that MultiDrag no longer exports because of version 1.12.x of sortablejs making an accidental breaking change. * **semantic:** pushes the changes to the git repository * please, build for me * peer dependencies now required * **deps:** Users want to use their own versions of sortablejs, so we'll allow it. * **deps:** Users want to use their own versions of sortablejs, so we'll allow it.

icflorescu changed the title ~~Attempted import error: 'MultiDrag' is not exported from 'sortablejs'~~ [bug] Attempted import error: 'MultiDrag' is not exported from 'sortablejs' Sep 25, 2020

waynevanson added the type:bug label Sep 26, 2020

waynevanson closed this as completed in f34c861 Sep 27, 2020

github-actions bot added the released label Sep 27, 2020

tomasmenezes mentioned this issue Jul 6, 2022

[bug] ReactSortable MultiDrag/Swap is not a constructor #143

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[bug] Attempted import error: 'MultiDrag' is not exported from 'sortablejs' #179

[bug] Attempted import error: 'MultiDrag' is not exported from 'sortablejs' #179

icflorescu commented Sep 25, 2020

waynevanson commented Sep 25, 2020

waynevanson commented Sep 25, 2020

Holenvik commented Sep 25, 2020

sagar1596 commented Sep 25, 2020

waynevanson commented Sep 25, 2020

Eric-Juquel commented Sep 25, 2020

waynevanson commented Sep 25, 2020

icflorescu commented Sep 25, 2020 •

edited

Loading

dagreatbrendino commented Sep 25, 2020 •

edited

Loading

waynevanson commented Sep 26, 2020

github-actions bot commented Sep 27, 2020

JUNNNI commented Sep 27, 2020

icflorescu commented Sep 28, 2020

himaniChaine commented Oct 16, 2020

chundhau commented Nov 2, 2020

Ciriak commented Nov 9, 2020

littlee commented Dec 13, 2020 •

edited

Loading

ArturoTorresMartinez commented Mar 29, 2023

[bug] Attempted import error: 'MultiDrag' is not exported from 'sortablejs' #179

[bug] Attempted import error: 'MultiDrag' is not exported from 'sortablejs' #179

Comments

icflorescu commented Sep 25, 2020

waynevanson commented Sep 25, 2020

waynevanson commented Sep 25, 2020

Holenvik commented Sep 25, 2020

sagar1596 commented Sep 25, 2020

waynevanson commented Sep 25, 2020

Eric-Juquel commented Sep 25, 2020

waynevanson commented Sep 25, 2020

icflorescu commented Sep 25, 2020 • edited Loading

dagreatbrendino commented Sep 25, 2020 • edited Loading

waynevanson commented Sep 26, 2020

github-actions bot commented Sep 27, 2020

JUNNNI commented Sep 27, 2020

icflorescu commented Sep 28, 2020

himaniChaine commented Oct 16, 2020

chundhau commented Nov 2, 2020

Ciriak commented Nov 9, 2020

littlee commented Dec 13, 2020 • edited Loading

ArturoTorresMartinez commented Mar 29, 2023

icflorescu commented Sep 25, 2020 •

edited

Loading

dagreatbrendino commented Sep 25, 2020 •

edited

Loading

littlee commented Dec 13, 2020 •

edited

Loading