Skip to content

fix(sdk-angular): lazy-load TinyMCE only when running inside UVE #35441

@fmontes

Description

@fmontes

Problem

@dotcms/angular statically imports @tinymce/tinymce-angular at the top level of its main bundle:

// dotcms-editable-text.component.ts
import { EditorComponent, TINYMCE_SCRIPT_SRC } from '@tinymce/tinymce-angular';

Because DotCMSEditableTextComponent is exported from the primary entry point (public_api.ts), every consumer that installs @dotcms/angular must also install @tinymce/tinymce-angular — even if they never use inline editing. Without it, Vite/esbuild throws at runtime:

Uncaught Error: Could not resolve "@tinymce/tinymce-angular" imported by "@dotcms/angular". Is it installed?

TinyMCE is only needed when a page is loaded inside the Universal Visual Editor (UVE) in edit mode. There is no reason for it to be a required dependency for every headless Angular app.

Expected Behavior

  • Consumers that don't use DotCMSEditableTextComponent should not need to install or bundle @tinymce/tinymce-angular
  • TinyMCE should only be loaded/resolved when the app is actually running inside UVE edit mode

Proposed Solution

Two complementary changes:

1. Move DotCMSEditableTextComponent to a secondary entry point

@dotcms/angular              ← no TinyMCE dependency
@dotcms/angular/editable-text ← imports TinyMCE, for UVE inline editing only

This is the standard ng-packagr pattern for optional features. Consumers opt in by importing from the sub-path.

2. Lazy-load @tinymce/tinymce-angular at runtime

Inside DotCMSEditableTextComponent, replace the static import with a dynamic import() gated on isEditMode — so the module is never fetched when the page renders outside UVE.

Current Workaround

Example apps must add @tinymce/tinymce-angular to their own package.json to avoid the runtime error. This is a leaky implementation detail that should be invisible to consumers.

Affected Packages

  • core-web/libs/sdk/angularDotCMSEditableTextComponent, public_api.ts, ng-package.json, package.json

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    Status

    New

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions