Cannot find package on server with Nuxt

[Aniketsurya]

We are using nuxt 3 (ssr true) application. Trying to use this package, its working fine in local. But when we try to deploy it, it fails with this issue.

[nuxt] [request error] [unhandled] [500] Cannot find package 'isomorphic-dompurify' imported from /home/site/wwwroot/server/chunks/app/server.mjs

We are using import statement as follows

import DOMPurify from "isomorphic-dompurify";

Let me know if I need to also add some other dependency. I already added jsdom and Dompurify separately and tried deploying.

[kkomelin]

Hey @Aniketsurya , Thanks for reporting the issue. Can you give me more information about your server environment?

[Aniketsurya]

Hello @kkomelin I am using Azure app service to deploy and to run it with a startup command using pm2. One more thing which I noticed is if I try to make it run on local with pm2 it runs well, but only that the same stage it fails in the pipeline. Seems like some import way is not correct. Or it is not compatible with Nuxt 3?

[kkomelin]

Hey @Aniketsurya , That's hard to debug for me because I don't have an Azure account. As for the package not being compatible with Nuxt 3, if it's working locally, then it's compatible with Nuxt 3. It might be not compatible with your specific Azure setup, however. Hard to say.

[Aniketsurya]

Hey @kkomelin, the difference between local and Azure environment is the OS. We run Azure on Linux, and local is on windows. Can that be a issue? If yes, what can be work around?

[kkomelin]

@Aniketsurya Linux is the default server OS. I'm using it myself locally. So I don't think Linux is the issue. What package manager are you using to build the project on the server? Can you share your deploy log?

[Aniketsurya]

Hey @kkomelin, I can't share the logs but the above was the main error shown. I am using npm for installing and pm2 for deployment and running the application but with pm2 it runs in local correctly.

[Aniketsurya]

Hey @kkomelin , I have been looking into this issue for quite a time now, got some different error currently so while building the project using nuxt build, it doesn't build the package properly for isomorphic-dompurify.

I build the package and zip it, while deploying I unzip it, while that unzipping it throws an error that

ENOTDIR: not a directory 'node_modules/dompurify'

If I check that zip package by downloading manually it has "dompurify" as a folder (directory) itself. Do you have any ideas I can try?

[Aniketsurya]

The issue is solved using RunFromZip and changing the startup command location of index.mjs.

[ashraf-gemini]

@Aniketsurya @kkomelin Facing the same issue here

Here's the codesandbox link to reproduce https://codesandbox.io/p/devbox/with-ssr-uch9k

[mohdashraf010897]

@kkomelin Any updates here?

[kkomelin]

@ashraf-gemini The library you're using in the provided code example @appbaseio/reactivesearch-vue depends on a previous version of isomorphic-dompurify (^1.12.0). Please ask its developers to update isomorphic-dompurify to the latest. Hope it helps.

[ashraf-gemini]

@kkomelin I am the maintainer of the package and I updated the version yesterday but still facing the same problem.

Here's the updated Codesandbox https://codesandbox.io/p/devbox/twilight-frost-qtwfxp

[kkomelin]

@ashraf-gemini Ah, I see. I've updated the package a few minutes ago. Current version is 2.12.0

[mohdashraf010897]

@kkomelin Looks like it still isn't resolved

https://codesandbox.io/p/devbox/fervent-water-q3rhdy?file=%2Fnuxt.config.ts%3A23%2C20

The requested module '/_nuxt/node_modules/isomorphic-dompurify/browser.js?v=164596ce' does not provide an export named 'sanitize'

[kkomelin]

@mohdashraf010897 The package you included @appbaseio/reactivesearch-vue is still using "isomorphic-dompurify": "^1.12.0" but we're on 2 now.

[ashraf-gemini]

@kkomelin It's just that the code changes aren't pushed post the version release, if you check the version within the shared codesandbox for appbase/reactivesearch-vue; it's 3.3.7-beta.2 which uses isomorphic-dompurify@2.x

[kkomelin]

@ashraf-gemini I need to see how you're importing it in your package. What's the branch name? Can you provide a link?