Skip to content

Migration auf ccm v25

Andre Kless edited this page Jan 31, 2020 · 3 revisions

Diese Wikiseite soll helfen eigene Komponente mit der ccm v25 wieder kompatibel bzw. lauffähig zu machen.

Hier die Änderungen von ccm v25.0.0:

  • moved not framework-relevant helper functions to extern ES6 module
  • bug fix for checking expired token
  • import property for loading a function can be given by URL hash code
  • added support of ‘beforeCreation’, ‘afterCreation’ and ‘onReady’ callback in config
  • removed loading icon as initial content
  • each instance knows his Shadow DOM via property ‘shadow’
  • bug fix for throw exception on invalid component filename in ccm.helper.convertComponentURL
  • bug fix for ignore of comments in HTML templates
  • ccm.helper.html can process SVG tags inside of ccm HTML data

Die wesentliche nicht-abwärtskompatible Änderung ist, dass viele nicht framework-relevante Hilfsfunktionen in das ES6-Module helper.mjs ausgelagert wurden. Der Link führt zur latest-Version des helper-Moduls.

Bei der Umstellung einer Komponente auf ccm v25 wird es also zu einem Fehler kommen, wenn auf eine Hilfsfunktion zugegriffen wird, die nun nicht mehr im ccm-Framework vorhanden ist.

Hier nun wie das behoben werden kann:

In der Standardkonfiguration im Komponentencode gilt es zunächst das ES6-Modul mit den Hilfsfunktionen einzubinden:

"helper": [ "ccm.load", "https://ccmjs.github.io/akless-components/modules/versions/helper-2.0.0.mjs" ] (ggf. prüfen ob es inzwischen schon eine aktuellere Version des helper-Moduls gibt)

Dann für die Instanz eine lokale Hilfsvariable let $ definieren und in der init-Methode nun die folgende Zuweisung:

$ = Object.assign( {}, this.ccm.helper, this.helper );

Über $ kann dann normal auf alle Hilfsfunktionen zugegriffen werden, denn sie enthält nun sowohl die framework-relevanten als auch die ausgelagerten nicht framework-relevanten Hilfsfunktionen. Sollte es dennoch zu einem Fehler kommen, dass eine Hilfsfunktion nicht korrekt ausführbar ist, dann am besten einmal überprüfen, ob sich für die betroffene Hilfsfunktion aus dem ES6-Modul der Name oder die Parameter geändert haben.

Alle ausgelagerten Hilfsfunktionen sind gut dokumentiert, die API findet sich hier.

Beispiele für Komponenten die bereits mit ccm v25 laufen sind

Clone this wiki locally