Nuxt•2d ago

Error when using deployed version of Nuxt module with Sanity depdendencies

I am currently trying to use Sanity dependencies within a Nuxt module. The module works completely fine in the playground, but when deploying to npm, it breaks in my Nuxt 3 App. The server starts up and then throws "Cannot find module './cjs/react.development.js'" once a client connects to the app. I installed the module in the Nuxt app like this:

"devDependencies": {
  "@sanity/types": "^3.68.3"
},
"dependencies": {
  "@devite/nuxt-sanity": "^2.0.1",
  "@nuxt/image": "^1.8.1",
  "@sanity/client": "^6.22.5",
  "@portabletext/vue": "^1.0.11",
  "nuxt": "^3.14.1592",
  "vue": "3.5.13",
  "vue-router": "^4.5.0"
}

"devDependencies": {
  "@sanity/types": "^3.68.3"
},
"dependencies": {
  "@devite/nuxt-sanity": "^2.0.1",
  "@nuxt/image": "^1.8.1",
  "@sanity/client": "^6.22.5",
  "@portabletext/vue": "^1.0.11",
  "nuxt": "^3.14.1592",
  "vue": "3.5.13",
  "vue-router": "^4.5.0"
}

4 Replies

kapa.ai•2d ago

Hi @Justix. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the knowledge sources provided, I don't have enough specific information to directly address your issue with the Sanity dependencies and the "Cannot find module './cjs/react.development.js'" error in your Nuxt 3 app. However, I can provide some general insights and suggestions based on similar issues reported in Nuxt 3: 1. Version compatibility: The error you're experiencing might be related to version incompatibilities. In one of the reported issues, updating the Vue version resolved a similar problem. You could try updating your Vue version:

   "vue": "^3.5.13"

   "vue": "^3.5.13"

Github Issue (closed): The new version release is missing files and cannot be run directly. (https://github.com/nuxt/nuxt/issues/30022) 2. ESM compatibility: Nuxt 3 uses native ES modules, which can sometimes cause issues with dependencies that are not fully ESM-compatible. You might need to check if the Sanity dependencies you're using are fully compatible with ESM. Docs > Guide > Concepts > ES Modules (https://nuxt.com/docs/guide/concepts/esm) 3. Build configuration: Ensure that your build configuration is correct. You might need to add the problematic module to the build.transpile array in your nuxt.config.ts:

   export default defineNuxtConfig({
     build: {
       transpile: ['problematic-module']
     }
   })

   export default defineNuxtConfig({
     build: {
       transpile: ['problematic-module']
     }
   })

Docs > Guide > Concepts > ES Modules > Troubleshooting ESM Issues (https://nuxt.com/docs/guide/concepts/esm#troubleshooting-esm-issues) 4. Dependency resolution: Sometimes, issues can arise due to how dependencies are resolved. You might want to try clearing your dependency cache and reinstalling:

   rm -rf node_modules
   npm cache clean --force
   npm install

   rm -rf node_modules
   npm cache clean --force
   npm install

Docs > Guide > Directory-structure > node_modules (https://nuxt.com/docs/guide/directory-structure/node_modules) If these suggestions don't resolve your issue, you might need to create a minimal reproduction of the problem and seek further assistance from the Nuxt community or the maintainers of the Sanity-related packages you're using. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2d ago

<@388689607488700418> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

JustixOP•2d ago

@danielroe do you have any idea why this could happen? your module (@nuxtjs/sanity) works fine with the same dependencies

danielroe•2d ago

there are some deeply problematic dependencies in the sanity stack. we set optimizeDeps in the module - you can take a look at the code and replicate in your own module

Gaming

Programming

Error when using deployed version of Nuxt module with Sanity depdendencies