matrix-org / matrix-rich-text-editor

Matrix Rich Text Editor
https://matrix-org.github.io/matrix-rich-text-editor/
Apache License 2.0
82 stars 19 forks source link

Importing @matrix-org/matrix-wysiwyg with esm + typescript results in error due to exports in package.json #976

Open MTRNord opened 1 month ago

MTRNord commented 1 month ago

Problem

TSC spits out this error for any import:

error TS7016: Could not find a declaration file for module '@matrix-org/matrix-wysiwyg'. '<redacted>/node_modules/@matrix-org/matrix-wysiwyg/dist/matrix-wysiwyg.js' implicitly has an 'any' type.
  There are types at '<redacted>/node_modules/@matrix-org/matrix-wysiwyg/dist/index.d.ts', but this result could not be resolved when respecting package.json "exports". The '@matrix-org/matrix-wysiwyg' library may need to update its package.json or typings.

Steps to reproduce

Import the package in an esm module project with these compilerOptions (these are somewhat vitejs as an origin):

    "compilerOptions": {
        "experimentalDecorators": false,
        "emitDecoratorMetadata": false,
        "resolveJsonModule": true,
        "esModuleInterop": true,
        "module": "es2022",
        "moduleResolution": "Bundler",
        "target": "es2020",
        "noUnusedLocals": true,
        "sourceMap": false,
        "outDir": "./lib",
        "declaration": true,
        "jsx": "react",
        "lib": ["es2021", "dom", "dom.iterable"],
        "strict": true,
        "allowImportingTsExtensions": true,
        "isolatedModules": true,
        "noEmit": true,
    },
MTRNord commented 1 month ago

It seems like this export declaration makes tsc happy:

"exports": {
        ".": {
            "import": {
                "types": "./dist/index.d.ts",
                "default": "./dist/matrix-wysiwyg.js"
            },
            "require": {
                "types": "./dist/index.d.ts",
                "default": "./dist/matrix-wysiwyg.umd.cjs"
            }
        }
    },