build failure due to upstream change in prosemirror-state on class Plugin

[wetternest]

Describe the bug

With prosemirror-state moving from javascript to typescript in version 1.4.0 the number of generic arguments for the class Plugin changed to one (optional). After running npm update (which updates prosemirror-state to 1.4.0) this results in the following build errors for my project:

Error: node_modules/@toast-ui/editor/types/spec.d.ts:40:41 - error TS2707: Generic type 'Plugin<PluginState>' requires between 0 and 1 type arguments.

40   keymaps(useCommandShortcut: boolean): Plugin<any, any>[];
                                           ~~~~~~~~~~~~~~~~

Error: node_modules/@toast-ui/editor/types/editor.d.ts:315:47 - error TS2707: Generic type 'Plugin<PluginState>' requires between 0 and 1 type arguments.

315   createKeymaps(useCommandShortcut: boolean): Plugin<any, any>[];
                                                  ~~~~~~~~~~~~~~~~

Fix

I fixed this by changing the according two lines as follows: Plugin<any, any>[]; => Plugin<any>[];

[mrdanielssan]

@wetternest hi. I had the same problem. Try to update packages @types/prosemirror-model, @types/prosemirror-commands, @types/prosemirror-inputrules, @types/prosemirror-state to the last version. It helps me. And #2551 fixed as well

[wetternest]

hi @AndrewBasiuk ! I just run npm update, shouldn't that update the packages you named too? To which version have you updated this packages? Thx

[mrdanielssan]

"@types/prosemirror-model": "^1.16.2", "@types/prosemirror-commands": "^1.0.4", "@types/prosemirror-inputrules": "^1.0.4", "@types/prosemirror-state": "^1.3.0",

When update packages try to remove node_modules folder and then run npm i again

[wetternest]

my build process always starts without node_modules folder and runs npm ci that means I would have to add dependencies for a third party bundle to my package.json, I am not amused by this solution :disappointed:

[upkey1010]

@wetternest agree. we need an official way to solve this. not work around.

[w3geekery]

on first implementation of editor, my build failed with same problem; I applied fix above and no more build error (verify working); thank you wetternest

Is there a version of the editor where I don't have to add fixes to the npm? i.e. which version of toast-ui/editor will build correctly so I can use it in a production environment without having to branch and add the fixes?

Edit: I was able to build without errors using tui.editor v 2.5.4, so I guess I don't get latest version for now sigh

[webmatth]

Hi all, As of today, there's one more type definition mismatch... here's what I've found so far!

https://github.com/nhn/tui.editor/blob/f2a8bae19a11e94b4943e9e80adb91d7de79f0f8/apps/editor/types/spec.d.ts#L4

should be: import { Command } from 'prosemirror-state';

https://github.com/nhn/tui.editor/blob/f2a8bae19a11e94b4943e9e80adb91d7de79f0f8/apps/editor/types/editor.d.ts#L315

should be: createKeymaps(useCommandShortcut: boolean): Plugin[];

https://github.com/nhn/tui.editor/blob/f2a8bae19a11e94b4943e9e80adb91d7de79f0f8/apps/editor/types/spec.d.ts#L40

should be: keymaps(useCommandShortcut: boolean): Plugin[];

Can someone do a PR for the fix?

Thanks

[davidgeary]

@AndrewBasiuk @wetternest Using this in an Angular project (with typescript v4.7.4) has long required me to include Prosemirror types in the project's dev-dependencies for:

• @types/prosemirror-commands
• @types/prosemirror-inputrules
• @types/prosemirror-model
• @types/prosemirror-state

This worked until I just upgraded to the latest editor version (3.2.0), which now breaks with a number of errors (a couple more than @webmatth found :grimacing:)

Error: node_modules/@toast-ui/editor/types/convertor.d.ts:1:38 - error TS2305: Module '"prosemirror-model"' has no exported member 'ProsemirrorNode'.

1 import { NodeType, MarkType, Schema, ProsemirrorNode, Mark } from 'prosemirror-model';
                                       ~~~~~~~~~~~~~~~

Error: node_modules/@toast-ui/editor/types/editor.d.ts:6:24 - error TS2307: Cannot find module '@t/index' or its corresponding type declarations.

6 import { Editor } from '@t/index';
                         ~~~~~~~~~~

Error: node_modules/@toast-ui/editor/types/editor.d.ts:336:47 - error TS2707: Generic type 'Plugin<PluginState>' requires between 0 and 1 type arguments.

336   createKeymaps(useCommandShortcut: boolean): Plugin<any, any>[];
                                                  ~~~~~~~~~~~~~~~~

Error: node_modules/@toast-ui/editor/types/spec.d.ts:4:10 - error TS2459: Module '"prosemirror-commands"' declares 'Command' locally, but it is not exported.

4 import { Command } from 'prosemirror-commands';
           ~~~~~~~

  node_modules/prosemirror-commands/dist/index.d.ts:2:10
    2 import { Command } from 'prosemirror-state';
               ~~~~~~~
    'Command' is declared here.

Error: node_modules/@toast-ui/editor/types/spec.d.ts:40:41 - error TS2707: Generic type 'Plugin<PluginState>' requires between 0 and 1 type arguments.

40   keymaps(useCommandShortcut: boolean): Plugin<any, any>[];

Fortunately, for now, downgrading to v3.1.10 fixes the errors.

[arimus]

I was able to get rid of the errors related to prosemirror by locking those version in resolutions section of package.json (I'm using pnpm). However, still getting the Cannot find module '@t/index' or its corresponding type declarations. error. It appears that this is because there is a mapping of @t to @types in tsconfig.json.

    "paths": {
      "@/*": ["src/*"],
      "@t/*": ["types/*"]
    },

From what I can tell, this line is a problem in editor.d.ts. Unless I'm missing something, it's cyclical and shouldn't be in here at all. Importing Editor from the index.d.ts, which imports Editor from editor.d.ts, seems a bit cyclical. Particularly when Editor is defined and exported from editor.d.ts.

import { Editor } from '@t/index';

The prose-mirror "fix", which is just locking some revisions (and probably not to the newest versions that don't cause issues):

    "@types/prosemirror-commands": "1.0.3",
    "@types/prosemirror-history": "1.0.1",
    "@types/prosemirror-inputrules": "1.0.4",
    "@types/prosemirror-keymap": "1.0.3",
    "@types/prosemirror-model": "1.7.2",
    "@types/prosemirror-state": "1.2.5",
    "@types/prosemirror-view": "1.15.1",
    "prosemirror-commands": "1.1.9",
    "prosemirror-history": "1.1.3",
    "prosemirror-inputrules": "1.1.3",
    "prosemirror-keymap": "1.1.4",
    "prosemirror-model": "1.14.1",
    "prosemirror-state": "1.3.4",
    "prosemirror-view": "1.18.7"

After adjusting the above for editor.d.ts and rebuilding, errors go away when building into my project. That said, I still get a bomb when trying to "new" the Editor:

ERROR TypeError: class constructors must be invoked with 'new'
    Transaction index.es.js:525
    get index.es.js:875
    setMarkdown index.js:4437
    setMarkdown index.js:22576
    ToastUIEditorCore index.js:22408
    ToastUIEditor index.js:25719
    editHtml edit.component.ts:1149

Update: had the same issue with 3.1.10 with the constructor issue above. Looks like Chrome was just unhappy with the target I had set (es2017) and I adjusted to output my Angular app to target es5, which worked just fine. So, it seems locking prosemirror deps and fixing the line in editor.d.ts seems to fix the issue.

Update: Created a gist patch for this, which I applied to the latest master branch and built. https://gist.github.com/arimus/fc85cb7ac2af7667fe7927108a9c4e13

[DupontC]

I have already had a similar problem. The problem comes from a dependency of tui-editor which during installation takes the latest minor version of the prosemirror-transform library which is no longer or not yet compatible with tui-editor. To get around this problem I fixed the version of tui-editor in the package.json :

 {
  "overrides": {
          "tui-editor": {
           "prosemirror-transform": "1.4.1"
          }
  },
  "dependencies": {
      "prosemirror-transform": "1.4.1",
      "tui-editor": "1.4.10"
  }
}

[puranjayjain]

This is still happening

[reynirf]

Yup this is still happening. Stuck in version 3.1.8 until this gets resolved.

[upkey1010]

temporary fix it by adding "skipLibCheck": true in tsconfig

{
  "compilerOptions": {
    "skipLibCheck": true
  }
}

[PaulVrugt]

so, is this going to be fixed?

[anuj9196]

I'm also facing this issue.

Error: node_modules/@toast-ui/editor/types/convertor.d.ts:1:38 - error TS2305: Module '"prosemirror-model"' has no exported member 'ProsemirrorNode'.

1 import { NodeType, MarkType, Schema, ProsemirrorNode, Mark } from 'prosemirror-model';
                                       ~~~~~~~~~~~~~~~

Error: node_modules/@toast-ui/editor/types/editor.d.ts:6:24 - error TS2307: Cannot find module '@t/index' or its corresponding type declarations.

6 import { Editor } from '@t/index';
                         ~~~~~~~~~~

Error: node_modules/@toast-ui/editor/types/editor.d.ts:336:47 - error TS2707: Generic type 'Plugin<PluginState>' requires between 0 and 1 type arguments.

336   createKeymaps(useCommandShortcut: boolean): Plugin<any, any>[];
                                                  ~~~~~~~~~~~~~~~~

Error: node_modules/@toast-ui/editor/types/spec.d.ts:4:10 - error TS2459: Module '"prosemirror-commands"' declares 'Command' locally, but it is not exported.

4 import { Command } from 'prosemirror-commands';
           ~~~~~~~

  node_modules/prosemirror-commands/dist/index.d.ts:2:10
    2 import { Command } from 'prosemirror-state';
               ~~~~~~~
    'Command' is declared here.

Error: node_modules/@toast-ui/editor/types/spec.d.ts:40:41 - error TS2707: Generic type 'Plugin<PluginState>' requires between 0 and 1 type arguments.

40   keymaps(useCommandShortcut: boolean): Plugin<any, any>[];
                                           ~~~~~~~~~~~~~~~

✖ Failed to compile.

using

• "@toast-ui/editor": "^3.2.2",

[hoangtuan2402]

This issue still happening !!

[isocks]

这个问题还存在，可以尝试在打包命令中使用 --skipLibCheck 等 TypeScript 编译选项，以忽略一些类型检查错误。例如：vue-tsc --noEmit --skipLibCheck && vite build

[ddurieux]

With recent version of typescript >= 5.0.0 it's working