🔮 Sanity Create is here. Writing is reinvented. Try now, no developer setup

Troubleshooting installation of @sanity/orderable-document-list plugin

15 replies
Last updated: Jan 5, 2023
Hi! I am new to Sanity and adding some documentation to my site. I’d like to add the
@sanity/orderable-document-list
plugin, but get this error:
./node_modules/@sanity/orderable-document-list/node_modules/@sanity/ui/dist/index.esm.js
Module parse failed: 'import' and 'export' may appear only with 'sourceType: module' (61:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See <https://webpack.js.org/concepts#loaders>
Any help or insight appreciated! Thank you!
Jan 5, 2023, 12:54 AM
Hey
user H
! What version of the Studio are you running and which command did you use to install the plugin?
Jan 5, 2023, 12:57 AM
I am running
3.0.0-rc.2
and did an npm install for the plgin
Jan 5, 2023, 1:01 AM
It’d be worth it to update to the latest version of the Studio. Can you share your desk structure where you’re implement the plugin?
Jan 5, 2023, 1:05 AM
Awesome, the upgrade got me past that initial error. Seeing this one now when I click the sidebar item in studio:
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Jan 5, 2023, 1:11 AM
Here’s what my desk structure looks like:
structure: (S, context) => {
        // The `Settings` root list item
        const settingsListItem = // A singleton not using `documentListItem`, eg no built-in preview
          S.listItem()
            .title(settingsType.title)
            .icon(settingsType.icon)
            .child(
              S.editor()
                .id(settingsType.name)
                .schemaType(settingsType.name)
                .documentId(settingsType.name)
            )

        // The default root list items (except custom ones)
        const defaultListItems = S.documentTypeListItems().filter(
          (listItem) => listItem.getId() !== settingsType.name
        )

        return S.list()
          .title('Content')
          .items([
            settingsListItem,
            S.divider(),
            ...defaultListItems,
            orderableDocumentListDeskItem({
              type: 'category',
              title: 'Categories',
              S,
              context,
            }),
          ])
      },
Jan 5, 2023, 1:12 AM
How are you importing the
orderableDocumentListDeskItem
?
Jan 5, 2023, 1:14 AM
import { orderableDocumentListDeskItem } from '@sanity/orderable-document-list'
Jan 5, 2023, 1:15 AM
I wonder if you somehow installed a V2 version of the plugin. What does your package.json look like? Can you run
npm install --save @sanity/orderable-document-list
just to rule it out?
Jan 5, 2023, 1:32 AM
Just reinstalled and same error. Also tried removing and installing again 😞
Jan 5, 2023, 1:48 AM
Can you share the output of
sanity versions
?
Jan 5, 2023, 2:04 AM
@sanity/cli                          2.31.1 (latest: 3.1.4)
@sanity/code-input                    3.0.1 (up to date)
@sanity/image-url                     1.0.1 (up to date)
@sanity/orderable-document-list       1.0.2 (up to date)
@sanity/table                         1.0.1 (up to date)
@sanity/vision                   3.0.0-rc.2 (latest: 3.1.4)
@sanity/webhook                       2.0.0 (up to date)
Jan 5, 2023, 2:06 AM
It looks like the actual
sanity
package is missing from that list. Can you share your package.json?
Jan 5, 2023, 2:09 AM
Noticed that the
sanity upgrade
command didn’t actually update
package.json
. so just updated
sanity
and it works!!
Jan 5, 2023, 2:13 AM
Thank you so much for helping with this and the quick responses! Much appreciated!
Jan 5, 2023, 2:14 AM
Fantastic! Glad it’s sorted 🙂
Jan 5, 2023, 2:29 AM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?