JS-Fehler bei heimrichhannot/contao-slick-bundle

Hallo,

hat jemand vielleicht das oben genannte Package mit Contao 4.4.x erfolgreich im Einsatz?
Nachdem sich das Package zuerst nicht via CM installieren ließ und erst eine Anpassung
der Version auf dev-master den gewünschten Erfolg brachte, kommt im Frontend bei meiner
lokalen Testinstallation immer ein Javascript Fehler und der Slider funktioniert nicht.

Ich habe daraufhin auch schon bereits probiert alternative jQuery Versionen einzubinden,
aber der Fehler bleibt, konkret:

HTML-Code:

---

contao-slick-bundle.min.js:formatted:16 Uncaught TypeError: b.not(...).slick is not a function
    at HTMLDivElement.<anonymous> (contao-slick-bundle.min.js:formatted:16)
    at Function.each (jquery.min.js:2)
    at n.fn.init.each (jquery.min.js:2)
    at Object.init (contao-slick-bundle.min.js:formatted:4)
    at HTMLDocument.<anonymous> (contao-slick-bundle.min.js:formatted:40)
    at i (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at Function.ready (jquery.min.js:2)
    at HTMLDocument.K (jquery.min.js:2)

---

Zeile 16 ist dann:

HTML-Code:

---

var d = g.data("slick", b.not(".slick-initialized").slick(e));

---

Kennt jemand das Problem und vielleicht auch die Lösung?

Vielen Dank und beste Grüße
Sares

Warum hast du dev-master installiert?

Hallo Spooky,

das liegt daran, dass sich die "latest version" nicht installieren ließ, ich glaube es gibt
dazu auch einen anderen Eintrag hier im Forum.

Konkret beendet der Contao Manager das dann wie folgt:

HTML-Code:

---

In InitCommand.php line 737:
                                                                             
  Could not find a version of package heimrichhannot/contao-slick-bundle matching your minimum-stability (stable). Require it with an explicit version constraint allowing its desired stability.                                   
                                                                             

require [--dev] [--prefer-source] [--prefer-dist] [--no-progress] [--no-suggest] [--no-update] [--no-scripts] [--update-no-dev] [--update-with-dependencies]
[--update-with-all-dependencies] [--ignore-platform-reqs] [--prefer-stable] [--prefer-lowest] [--sort-packages] [-o|--optimize-autoloader] [-a|--classmap-authoritative]
[--apcu-autoloader] [--] [<packages>]...

---

Beste Grüße
Sares

Was hattest du in der composer.json eingetragen?

Achso, weil die Extension nur Beta Releases hat. Du musst folgendes als Version Requirement in deiner composer.json bzw. im Contao Manager eintragen: ^1.0@beta

dev-master solltest du nur installieren, wenn du einen bestimmten Grund dafür hast.

Hallo Spooky,

wieder was gelernt :-)

Hab das gerade ausprobiert und konnte damit die Beta installieren und
der Javascript Fehler ist somit auch Geschichte.

Vielen Dank für deine Hilfe!

Beste Grüße
Sares

Ich habe leider genau das selbe Problem, jedoch mit einer Contao 4.4.40 und der 1.0.0-beta17.
Dies scheint ja die Kombination zu sein, in der bei Sares die Probleme nicht mehr auftreten. Bei mir leider doch.

Gibt es da zur Lösung des Problems neue Erkenntnisse, die mir auf die Sprünge helfen könnten?

Vielen Dank
Timon

Hi,

Du musst wie von Spooky beschrieben die oben genannte Version eintragen, dann sollte es funktionieren.

Sares

Gesendet von meinem SM-G973F mit Tapatalk

Hallo Sares,

danke für die schnelle Reaktion.
Ich habe genau das Eingegeben und damit die neueste Beta installiert.

Es scheint aber irgendwie noch an ein anderes Problem zu geben, dass die Fehlermeldung auslöst ...

Hast du denn die originale jQuery Version installiert oder hast Du da was geändert
Hast Du jQuery lokal oder aus einem CDN eingebunden?

Welche jQuery Version ist bei Dir aktiv - vielleicht liegt es daran?

Gruß
Timon

Hi,

ich habe ebenfalls Contao 4 4.40 und jQuery über das Seitenlayout eingebunden und ich lade es lokal.

Welche genaue Version das jetzt ist weiß ich nicht, das könnte ich aber eventuell morgen noch eruieren, in jedem Fall die, die Contao mitbringt.

Welche Fehlermeldung bekommst du denn überhaupt und gibt es vielleicht auch eine URL zu der Seite?

Beste Grüße
Sares

Gesendet von meinem SM-G973F mit Tapatalk

Hallo Sares,

es handelt sich um die Meldung:
b.not(".slick-initialized").slick is not a function. (In 'b.not(".slick-initialized").slick(e)', 'b.not(".slick-initialized").slick' is undefined)

URL der Testseite: http:://base.contao.sixtmedia.de

Im unteren Teil der Seite habe ich einen Bilderslider eingestellt. Die Elemente werden nur untereinander dargestellt, da der Slider - aufgrund des JS Fehlers - nicht initialisiert wird.
ich hab schon alles mögliche Probiert, alles erfolglos.

Danke für deine Hilfe
Timon

Anscheinend wurde heimrichhannot-contao-components/slick bei dir nicht installiert oder nicht richtig installiert. slick.min.js wird nämlich nicht eingebunden.

Das wars. Vielen Dank!

Es war richtig installiert, aber nicht eingebunden.
Ich habe jetzt die fehlende Dateien über die zusätzlichen Head-Tags im Seitenlayout eingebunden

<script src="/assets/slick/slick/slick.min.js"></script>
<link rel="stylesheet" href="/assets/slick/slick/slick.css">
<link rel="stylesheet" href="/assets/slick/slick/slick-theme.css">

Ist das so gedacht? Oder müsste ich ein Template einbinden (hab keines gefunden)? Oder ist tatsächlich was in der Installation schief gegangen?

Vielen Dank für euren Einsatz !
Timon

Nein, das ist nicht so gedacht. Das wird von der Erweiterung automatisch gemacht. Man müsste nun rausfinden, warum das bei dir nicht passiert.

O.K. Dann weiß ich Bescheid und mach mich mal auf die Suche.

Vielen Dank nochmal.

Gruß
Timon

Ah, ich weiß schon warum das passiert. Du bist wahrscheinlich bei Contao 4.7. Siehe https://github.com/contao/contao/issues/446

Als workaround kannst du folgendes machen:

PHP-Code:

---

<?php

// app/Resources/contao/config/config.php

if ('FE' === TL_MODE) {
    $GLOBALS['TL_USER_CSS']['slick']                 = 'assets/slick/slick.css|static';
    $GLOBALS['TL_JAVASCRIPT']['slick']               = 'assets/slick/slick.min.js|static';
    $GLOBALS['TL_JAVASCRIPT']['contao-slick-bundle'] = 'bundles/heimrichhannotcontaoslick/js/contao-slick-bundle.min.js|static';
}

---

Die zusätzlichen <head> tags kannst du dann wieder entfernen.

Hallo Spooky,

nein ich bin in der 4.4.40.

Das Problem scheint zu sein, dass im contao-slick-bundle in der /contao/config/config.php folgendes eingebunden wird:
$GLOBALS['TL_USER_CSS']['slick'] = 'assets/slick/slick.css|static';
$GLOBALS['TL_JAVASCRIPT']['slick'] = 'assets/slick/slick.min.js|static';

Die Dateien werden bei mir aber in

$GLOBALS['TL_USER_CSS']['slick'] = 'assets/slick/slick/slick.css|static';
$GLOBALS['TL_JAVASCRIPT']['slick'] = 'assets/slick/slick/slick.min.js|static';

installiert. Also slick/slick/slick.min.js

Das erscheint mir auch logisch, da die Abhängigkeit lautet:
"heimrichhannot-contao-components/slick": "^1.8.1"

und dort (auf GitHub) sehe ich wieder einen Unterordner /slick

Auf jeden Fall werden die Dateien eingebunden wenn ich den Dateipfad auf assets/slick/slick/slick.min.js anpasse

Ob das ein Problem meiner Installation ist oder ein allgemeines kann ich nicht so recht beurteilen ...

Gruß
Timon

Ah ok. Dann würde ich das als Bug auf GitHub reporten.

Mir ist noch aufgefallen, dass bei jedem Update über den Contao-Manager folgende Meldung kommt:

Package heimrichhannot/contao-ajax is abandoned, you should avoid using it. Use heimrichhannot/contao-ajax-bundle instead.
Package heimrichhannot/contao-multi_column_editor is abandoned, you should avoid using it. Use heimrichhannot/contao-multi-column-editor-bundle instead.
Package heimrichhannot/contao-request is abandoned, you should avoid using it. Use heimrichhannot/contao-request-bundle instead.

Grundsätzlich funktioniert aber alles, vermutlich liegt das aber an der Beta Version, die ich einsetze, keine Ahnung.

Beste Grüße
Sares

Hast du diese Pakete selbst installiert? Wenn ja, kannst du etwas dagegen tun. Wenn nicht, also wenn das Abhängigkeiten sind, dann nicht.

Nein, ich hab davon nichts selbst installiert, die Pakete sind mit dem Slick Slider quasi mitgeliefert worden.

Vermutlich wird sich das "Problem" aber spätestens dann von selbst lösen, wenn das Modul nicht mehr
beta ist. Ich werde aber vielleicht einfach ein Ticket aufmachen, damit Sie das nicht übersehen.

Vielen Dank Spooky und beste Grüße
Sares

Nur eine Frage am Rande: Wieso nutzt du eine Erweiterung für slick? Du kannst auch einfach den Contao-Internen Slider verwenden und dann einfach eine js_slickslider erstellen:

PHP-Code:

---

<?php
$GLOBALS['TL_CSS'][] = 'assets/slick-carousel/slick/slick.css';
$GLOBALS['TL_JAVASCRIPT'][] = 'assets/slick-carousel/slick/slick.js';
?>
<script>
    (function ($) {
        $(document).ready(function () {
            $('.ce_sliderStart').each(function (i, cte) {
                var s = $('.content-slider', cte)[0],
                        c = s.getAttribute('data-config').split(',');
                $(s).children('.slider-wrapper').slick({
                    autoplay: parseInt(c[0]) > 0 ? true : false,
                    autoplaySpeed: parseInt(c[0]),
                    speed: parseInt(c[1]),
                    initialSlide: parseInt(c[2]),
                    dots: s.getAttribute('data-dots') ? true : false,
                    arrows: s.getAttribute('data-arrows') ? true : false
                });
            });
        });
    })(jQuery);
</script>

---

Solltest du zwingend weitere Optionen brauchen, lässt sich das z.B. über weitere Felder via DCA einbinden :D einfach das latest in den assets/-Ordner und fertig.

Würde mich hier gerne nochmal dranhängen...Ich bin mit Contao 4.7 unterwegs.
Ich habe den Slickslider ganz normal über den Contao Manager installiert und auch bei mir funktionierte der Slider nicht, da die Scripts nicht eingebunden worden. Ich habe dann die ganzen o.g. Anpassungen versucht, nichts hat zum Erfolg geführt. Letztlich habe ich die Scripts direkt im Template unter zusätzliche Head Tags eingebunden:

Code:

---

<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick-theme.css"/>

---

Und unter Eigener Javascript Code:

Code:

---

<script type="text/javascript" src="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.min.js"></script>

---

Jetzt lädt und lädt der Slider, aber die Bilder erscheinen nicht. Hab testweise auch andere Scripts deaktivert, um zu testen, ob die sich gegenseitig blockieren, bringt aber auch keine Änderung.
Hat noch jemand einen Tipp für mich? Link zur Seite Der Slick Slider ist ganz unten.

Echt keiner eine Idee? Hilft evtl. ein Update auf Contao 4.8? :(

Der Fehler muss grundsätzlich vom Entwickler behoben werden. Evt. kannst du die Entwickler ja mal direkt kontaktieren und die Umsetzung beauftragen.

Zitat:

---

Zitat von Christina17

[...]
Jetzt lädt und lädt der Slider, aber die Bilder erscheinen nicht. Hab testweise auch andere Scripts deaktivert, um zu testen, ob die sich gegenseitig blockieren, bringt aber auch keine Änderung.
Hat noch jemand einen Tipp für mich? Link zur Seite Der Slick Slider ist ganz unten.

---

Ja es gibt da einige Bugs, aber der Autor scheint da nicht weiter aktiv zu sein. Er selber meldet sich nicht, im Bug-Tracker melden sich hier und stimmen, dass er bald wieder da ist.

Nichtsdestotrotz empfehle ich dir die Variante von mir zu nutzen: Du brauchst nichts zu installieren, du musst dazu aber (natürlich) die Sourcen der Version 1.8.0/1 manuell in den assets-Ordner schieben. Es ist sowieso wesentlich besser kein cdn zu nutzen, sondern die Ressourcen lokal vorzuhalten. Ist nicht nur schneller, bedeutet auch weniger Geraffel im Datenschutzhinweis ;-)