Closed mathiasdeoliveira closed 8 months ago
Oha, we didn't change much that might impact how to import the library, do you have more info per chance?
Maybe the changes done in early November are the culprit? cc @ssi02014
I have same issue using React
I have the same issue using LIT.
This is the error message i get:
Import "sanitize" will always be undefined because there is no matching export in "../../node_modules/dompurify/dist/purify.es.mjs" [import-is-undefined]
@ssi02014 If possible, please have a look. I am pretty sure this is because of the changes in November:
https://github.com/cure53/DOMPurify/pull/874#issuecomment-1803975568
Also getting this error once my app updated from 3.0.6 -> 3.0.7
@cure53
Until v3.0.6, we loaded "dist/purify.js" in umd
format, but since v3.0.7, we load "dist/purify.es.mjs" in esm
format, which seems to cause related issues.
Currently, purfiy is exporting via export default createDOMPurify();
so importing with import DOMPurify from 'dompurify'
doesn't seem to cause the issue.
@ssi02014 I have the issue importing with import * as DOMPurify from 'dompurify';
import DOMPurify from 'dompurify'
Do you get an error if you do the above?
import DOMPurify from 'dompurify'
Do you get an error if you do the above?
Either way we need a fix that makes things work for everyone who uses the ways described above (i.e. not break things). I am happy to release a 3.0.8 once this is sorted. I cannot do much here myself, but I presume it's a quick fix after all :smile:
@mathiasdeoliveira @Justxs @pauly92 @CaptainGlac1er This PR should fix the issue, please check if possible if this does the trick indeed. If so, we will release 3.0.8 tomorrow. Thanks @ssi02014 for the super-fast reaction!
@ssi02014 this is probably why I didn't use that approach.
@cure53 also ccing you on this ^
This might be helpful. Are The Types Wrong? is reporting that the ESM export is "Masquerading as CJS".
https://arethetypeswrong.github.io/?p=dompurify%403.0.7
┌───────────────────┬────────────────────────┬──────────────────────────┐
│ │ "dompurify" │ "dompurify/package.json" │
├───────────────────┼────────────────────────┼──────────────────────────┤
│ node10 │ 🟢 │ 🟢 (JSON) │
├───────────────────┼────────────────────────┼──────────────────────────┤
│ node16 (from CJS) │ 🟢 (CJS) │ 🟢 (JSON) │
├───────────────────┼────────────────────────┼──────────────────────────┤
│ node16 (from ESM) │ 🎭 Masquerading as CJS │ 🟢 (JSON) │
├───────────────────┼────────────────────────┼──────────────────────────┤
│ bundler │ 🟢 │ 🟢 (JSON) │
└───────────────────┴────────────────────────┴──────────────────────────┘
When I tested, * as DOMPurify
worked fine for "purify.js" in umd
format, but not for "purify.es.mjs" in esm
format.
"conditional export"
was applied in v3.0.7, but I worked on reverting it back.
I expect this will be fixed.
I have the same problem in Angular with allowSyntheticDefaultImports
enabled.
Slickgrid/node_modules/@types/dompurify/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
7 import DOMPurify from 'dompurify';
~~~~~~~~~
node_modules/@types/dompurify/index.d.ts:4:1
4 export = DOMPurify;
~~~~~~~~~~~~~~~~~~~
This module is declared with 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
if I remove @types/dompurify
then my build works but then I get lint errors in my editor
Could not find a declaration file for module 'dompurify'.
So I wonder if there's a problem with @types/dompurify
instead of the actual release? Because that type only got updated a month ago so it doesn't follow the new release which was just couple days ago, shouldn't the type also be updated and that might fix the issue?
Thanks, @ghiscoding and @ssi02014 - I am unsure now, shall we go with the given PR or file a PR against @types/dompurify
?
i have issue in react v18 codebase (CRA) - webpack wont build; i have only available "@types/dompurify": "3.0.5",
Thanks, @ghiscoding and @ssi02014 - I am unsure now, shall we go with the given PR or file a PR against
@types/dompurify
?
The revert of all the exports will probably (hopefully) help, I think that I would give that a try so that we can still import * as dompurify from 'dompurify
in Angular because for some reason or another Angular doesn't like import dompurify from 'dompurify
even when allowSyntheticDefaultImports
is enabled... so I think the PR that reverted the exports
will help (finger crossed 🤞🏻)
EDIT
I tried manually by removing exports
(same as PR #896) from node_modules/dompurify/package.json
and my Angular build works now, if I had back the exports
then it fails again, so yes the PR #896 does fix the issue in Angular. I would suggest releasing it.
Note, for anyone who wants to try manually in Angular, you need to make sure to delete the .angular
cache or that won't work
This release should fix it: https://github.com/cure53/DOMPurify/releases/tag/3.0.8
It seems to be working fine, thanks! 🤗 @cure53 @ghiscoding @mathiasdeoliveira
I also confirmed that my CI build is now working, this issue could probably be closed since it was for Angular and I just confirmed that it works in Angular. Thanks for this great project and the quick turnaround with a fix 👍🏻
Awesome, phew :heart: Glad to hear it worked!
[bug] - Build error in angular app since your last version 3.0.7
Error: export 'sanitize' (imported as 'DOMPurify') was not found in 'dompurify' (possible exports: default)
Background & Context
We use your library with Angular version 15 and dompurify import in non-fixed mode.
package.json
"dompurify: "^3.0.6",
and import like this into the typescript file
import * as DOMPurify from 'dompurify';
Temporary solution :
use fixed version "dompurify: "3.0.6"