reactjswebpackpluginssanitygroq

Error: Errors while building: ./node_modules/@floating-ui/dom/dist/floating-ui.dom.esm.js Module parse failed: Unexpected token (307:11)


Hi everyone hope you all doing good,

I am trying to add a plugin to sanity and the plugin is sanity-plugin-order-documents .
I have followed all the steps shown in the documentation step by step.

I added "plugins": [ "order-documents" ], to sanity.json
And add this field :
{ name: "order", title: "Order", type: "number", hidden: true, },
to sanity\schemas\projects.js

.
And this is how I used the plugin in my code:

useEffect(() => {
    sanityClient.fetch(
      `
        *[_type == "projects"] | order(order asc){
        ...,
        }
      `
    ).then((data) => {
      setProjectsData(data)
    })
    
  }, [])

But whenever I try to do sanity start or sanity deploy I got this error :

Error: Errors while building:
./node_modules/@floating-ui/dom/dist/floating-ui.dom.esm.js
Module parse failed: Unexpected token (307:11)
You may need an appropriate loader to handle this file type.
|   }
| 
|   return { ...rect,
|     x: rect.x - scroll.scrollLeft + offsets.x,
|     y: rect.y - scroll.scrollTop + offsets.y
 @ ./node_modules/react-select/dist/react-select.esm.js 24:0-26
 @ ./node_modules/sanity-plugin-order-documents/build/components/organisms/TypeSection.js
 @ ./node_modules/sanity-plugin-order-documents/build/components/OrderDocuments.js
 @ ./node_modules/sanity-plugin-order-documents/build/index.js
 @ ./node_modules/sanity-plugin-order-documents/build?sanityPart=all%3Apart%3A%40sanity%2Fbase%2Ftool
 @ ./node_modules/@sanity/default-layout/lib/util/getRegisteredTools.js
 @ ./node_modules/@sanity/default-layout/lib/router.js
 @ ./node_modules/@sanity/default-layout/lib/Root.js?sanityPart=part%3A%40sanity%2Fbase%2Froot
 @ ./node_modules/@sanity/base/lib/components/SanityRoot.js?sanityPart=part%3A%40sanity%2Fbase%2Fsanity-root
 @ ./node_modules/@sanity/server/lib/browser/entry.js
 @ multi ./node_modules/@sanity/server/lib/browser/entry.js
    at buildStaticAssets (C:/Users/Slima/Desktop/abdellah-slimani-portfolio/sanity/node_modules/@sanity/core/lib/actions/build/buildStaticAssets.js:103:13)
    at async _default (C:/Users/Slima/Desktop/abdellah-slimani-portfolio/sanity/node_modules/@sanity/core/lib/actions/deploy/deployAction.js:78:9)

I have done some research to solve this problem, and I see many people suggest to edit the webpack file but I have no idea about what to add to that file.

please send help, SOS.


Solution

  • I ran into this issue just now and after doing some digging, it seems like Sanity v2 doesn't play well with react-select@^5. I had a look at some Sanity plugins that have upgraded react-select@^5 recently and all packages trigger this error message. You should bind the following packages to the latest version that has react-select smaller than 5.

    yarn add or npm install