Type of Editor.ui not resolvable with Yarn (strict) PnP mode

[jnoordsij]

📝 Provide detailed reproduction steps (if any)

1. Setup a project with TypeScript + Yarn PnP (default strict mode)
2. Create a plugin file along the lines of

import {Plugin} from 'ckeditor5';

export default class FooUI extends Plugin {
  init() {
    this.editor.ui.componentFactory.add('addFoo', (locale) => {
      ...
  }
}

3. Run tsc to check types

✔️ Expected result

The type of this.editor.ui to be resolved correctly, so that consequently the type of locale in the componentFactory.add call can be inferred.

❌ Actual result

The type of this.editor.ui.componentFactory is marked as any yielding an error Parameter 'locale' implicitly has an 'any' type.ts(7006).

❓ Possible solution

This issue only appears with Yarn PnP mode, as the import import type { EditorUI } from '@ckeditor/ckeditor5-ui'; within the ckeditor5-core cannot be resolved, since the package is not listed as dependency in ckeditor5-core. To make this resolvable, the @ckeditor/ckeditor5-ui should be listed as dependency, peerDependency or optional peerDependency in the ckeditor5-core, with the last one probably being the best option.

Manual workarounds:

• import the type EditorUI and manually cast with (this.editor.ui as EditorUI)
• use pnpMode: loose or non-pnp mode with Yarn
• patch the (optional) peer dependency within your own project by adding the following to .yarnrc.yml:

packageExtensions:
  # See https://github.com/ckeditor/ckeditor5/issues/17213
  "@ckeditor/ckeditor5-core@*":
    peerDependencies:
      "@ckeditor/ckeditor5-ui": "*"
    peerDependenciesMeta:
      "@ckeditor/ckeditor5-ui":
        optional: true

📃 Other details

• Browser: N/A
• OS: N/A
• First affected CKEditor version: 42.0.0 (possibly earlier); edit: still observed on 43.2.0
• Installed CKEditor plugins: N/A

---

If you'd like to see this fixed sooner, add a 👍 reaction to this post.

[Witoso]

Resolved in v42.0.2, please verify :)

[jnoordsij]

I'm currently running into this issue on the latest version (43.2.0).

[filipsobol]

We use a linter that checks for missing dependencies and devDependencies. At some point, we decided that it should treat type-only imports as devDependencies, but we will review this decision.

[jnoordsij]

As an alternative to dependencies vs devDependencies, adding it as (optional) peerDependencies entry will also work I found (added the configuration snippet in workarounds above). Maybe this might be a more suitable middle ground for type-only imports?

[filipsobol]

The fixes are merged and will be available in the next release.