kkomelin
Cannot find package on server with Nuxt
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.
Hey @Aniketsurya , Thanks for reporting the issue. Can you give me more information about your server environment?
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?
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.
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?
@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?
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.
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?
The issue is solved using RunFromZip and changing the startup command location of index.mjs.
@Aniketsurya @kkomelin Facing the same issue here
Here's the codesandbox link to reproduce https://codesandbox.io/p/devbox/with-ssr-uch9k
@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.
@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 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'
@mohdashraf010897 The package you included @appbaseio/reactivesearch-vue is still using "isomorphic-dompurify": "^1.12.0" but we're on 2 now.
@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 [email protected]
@ashraf-gemini I need to see how you're importing it in your package. What's the branch name? Can you provide a link?