abbrechen
Suchergebnisse werden angezeigt für 
Stattdessen suchen nach 
Meintest du: 

Problem: SCSS-Support in Themes ist veraltet

Gelöst
ChristianDE
Tourist
10 0 1

Hallo,

ich habe ein großes Problem mit dem Shopify Editor. Hier wird mir folgendes angezeigt: 

SCSS-Support in Themes ist veraltet

Wandle .scss- und .scss.liquid-Dateien für eine bessere Leistung des Onlineshops und Theme-Editors in .css- oder .css.liquid-Dateien um.

 

Was soll ich machen? Wie wandle ich .scss und .scss.liquid Dateien in css um? Ich hoffe man findet schnell eine Lösung. 

Vielen Dank

0 Likes
ChristianDE
Tourist
10 0 1

Hilfe !!!!!

Seitdem ich den Code neu gespeichert habe, ist der Shop komplett zerstört. Ich bin total enttäuscht!!!!!!!!!!!!!

Ich benutze das Shopify Venture Theme seit Juni 2020.

0 Likes
r8r
Shopify Expert
1273 134 425

Hallo @ChristianDE 

Oha … ich vermute, dass die Herrschaften langsam ernst machen: Deprecating Sass in themes

Abhängig davon, wie genau deine Codestruktur aussieht, kannst du SCSS nach CSS mit einem der zahlreichen online-Services transpilen (generieren) – wie z.B. mit SASSmeister.

Nota Bene: SCSS-Dateien sind fast immer die bessere Ressource für deinen Development Code. Shopify möchte aber SCSS nicht mehr dynamisch nach CSS transpilen. Ich empfehle, dass Du die SCSS Sourcen aus deinem assets/ Verzeichnis mit deren CSS Ergebnis ersetzt, die SCSS Quelltexte aber offline archivierst. Von denen kannst Du später wieder CSS transpilen. Du kannst das auch in einen automatisierten lokalen Prozess packen. Empfehlung für Fortgeschrittene: Verwendung von Build-Tools wie Gulp oder Webpack gemeinsam mit Shopify Themekit.

LG, Mario

Mario Rader [he] ★ If you want to achieve greatness, stop asking for permission. ★ Studio Mitte
• Meine Antwort war hilfreich? Hinterlass bitte ein Like.
• Meine Antwort hat Dein Problem behoben? Bitte akzeptiere sie als Lösung.
• Ich hab dir etwas erspart? Ich freue ich mich immer über eine kleine Aufmerksamkeit
• Ja, ich biete Shopify-Services & -Entwicklung und freue mich von Dir zu hören!
• Bitte teile einen Link zu der Seite, deren Problem Du in deinem Beitrag beschreibst!

• Yes, I provide Shopify-services & -development. Feel free to get in touch!
• Please share a link to the site, which you refer to in your problem description. This incredibly increases the chances of you receiving a useful answer!
• My answer was useful? Please leave a Like.
• My answer solved your issue? Please accept it as the solution.
• I saved you time or money? I'm always happy to receive a little thank you.
0 Likes
r8r
Shopify Expert
1273 134 425

Vielleicht eine blöde Frage, aber hast Du ein einigermaßen aktuelles Backup deines Themes? Notfalls müsstest Du sonst Venture noch einmal installieren und dann aus diesem jungfräulichen Theme die beim Production-Theme in Mitleidenschaft gezogenen Dateien ersetzen.

Mario Rader [he] ★ If you want to achieve greatness, stop asking for permission. ★ Studio Mitte
• Meine Antwort war hilfreich? Hinterlass bitte ein Like.
• Meine Antwort hat Dein Problem behoben? Bitte akzeptiere sie als Lösung.
• Ich hab dir etwas erspart? Ich freue ich mich immer über eine kleine Aufmerksamkeit
• Ja, ich biete Shopify-Services & -Entwicklung und freue mich von Dir zu hören!
• Bitte teile einen Link zu der Seite, deren Problem Du in deinem Beitrag beschreibst!

• Yes, I provide Shopify-services & -development. Feel free to get in touch!
• Please share a link to the site, which you refer to in your problem description. This incredibly increases the chances of you receiving a useful answer!
• My answer was useful? Please leave a Like.
• My answer solved your issue? Please accept it as the solution.
• I saved you time or money? I'm always happy to receive a little thank you.
0 Likes
ChristianDE
Tourist
10 0 1

Hi,

einen Unterschied von meinem Venture Theme zum neusten konnte ich jetzt nicht entdecken. Das neuste Venture Theme nutzt immer noch scss.

Wenn ich bei sass meister und bei anderen online compilern reinkopiere kommt dort die Antwort : Error, unable to compile code (cssportal)

Der Code ist aber eigentlich Fehlerlos.

 

0 Likes
ChristianDE
Tourist
10 0 1

@r8r 

Ich benötige leider genauere Instruktionen. Ich wäre dir sehr dankbar, wenn ich eine schnelle und einfach erklärte Lösung von dir oder jemand anderem erhalten könnte. Derzeit klappt gar nichts mehr. Der sassmeister konnte mir auch nicht helfen. Es gab keine Ausgabe.

0 Likes
r8r
Shopify Expert
1273 134 425

Erfolg.

@ChristianDE

Ich seh die Meldung in mehreren Projekten, jedoch nirgendwo einen Anhaltspunkt dafür, dass aktuell irgendwas davon zerstört würde. Bist du dir sicher, dass dein unmittelbares Problem nicht von einem anderen Fehler (evtl. im SASS-Code?) verursacht wird? Meine Empfehlung vorab: Hintergrundwissen zum Thema aneignen; auch wenn Shopify sich an Laien richtet, wenn du selbst im Code arbeitest, hilft es, wenn du dir den Background zu den verwendeten Technologien zu Gemüte führst.

Aber nun zur eigentlichen Antwort … Im Prinzip müsste das Ganze wie folgt funktionieren - getestet hab ich’s en Detail aber nicht.
Was du machen kannst ist, dass du die SASS Sourcen durch CSS Sourcen ersetzt. So würd ich’s zusammenfassen:

1. Backup des funktionierenden Themes machen

2. Besorge dir eine Kopie der kompilierten css-Dateien

folgende entweder/oder Optionen fallen mir ein:

a. Verwende Themekit und lade dir das Theme mit theme download runter

die kompilierten css-Dateien sind da inkludiert

b. Kompilier dir die Dateien selbst lokal mit SASS

idealerweise kannst du mit Themetit und theme deploy dann auch gleich die Dateien raufschieben

c. Lade die Dateien im Browser runter

7FB07DF6-9AC3-4CD3-9769-E1ED9FA2C4A5.jpeg

  • Quelltext der z.B. Startseite ansehen
  • Nach scss suchen
  • Pfad der gefundenen Dateien jeweils in neuem Browserfenster öffnen und den Inhalt jeweils als css-Datei speichern

3BFF3E23-1F95-4D36-B71A-37C0124673E7.jpeg

3. Referenzen auf die scss Dateien aus den Liquid Dateien entfernen

Diese sollten in erster Linie in den Dateien im layouts-Ordner zu finden sein; z.B. in der theme.liquid:

8F189026-66CF-4A4A-8A04-54BEC62B8542.jpeg
Die Dateiendung sollte hier jeweils auf .css geändert werden.

3. css-Dateien anstatt der scss-Dateien im assets-Verzeichnis anlegen

F8515A3A-A48D-45E5-A96D-CB86D3E9A4DA.jpeg
Je scss.liquid-Datei leg eine gleichnamige css.liquid-Datei an - solltest du im Schritt 2 Variante a oder b gewählt haben, könnte das optional sein. Jedenfalls bei Variante c brauchst du nur die von dir gespeicherten css-Dateien in diesen Ordner hochladen.

Liebe Grüße,
Mario

 

 

Mario Rader [he] ★ If you want to achieve greatness, stop asking for permission. ★ Studio Mitte
• Meine Antwort war hilfreich? Hinterlass bitte ein Like.
• Meine Antwort hat Dein Problem behoben? Bitte akzeptiere sie als Lösung.
• Ich hab dir etwas erspart? Ich freue ich mich immer über eine kleine Aufmerksamkeit
• Ja, ich biete Shopify-Services & -Entwicklung und freue mich von Dir zu hören!
• Bitte teile einen Link zu der Seite, deren Problem Du in deinem Beitrag beschreibst!

• Yes, I provide Shopify-services & -development. Feel free to get in touch!
• Please share a link to the site, which you refer to in your problem description. This incredibly increases the chances of you receiving a useful answer!
• My answer was useful? Please leave a Like.
• My answer solved your issue? Please accept it as the solution.
• I saved you time or money? I'm always happy to receive a little thank you.
ChristianDE
Tourist
10 0 1

@r8r 

Hallo Mario,

echt vielen Dank für diese schnelle und wirklich sehr ausführliche Antwort von Dir. Diese Anleitung wird noch sehr vielen Anderen helfen.

LG Christian

r8r
Shopify Expert
1273 134 425

@ChristianDE Gerne. Sie bildet natürlich nicht vollinhaltlich alles Aspekte ab (insbesondere etwaige Liquid-Variablen, die in scss-Dateien Verwebdung finden könnten), aber ich glaub, dass du damit schon einmal das Problem fixen kannst!

Mario Rader [he] ★ If you want to achieve greatness, stop asking for permission. ★ Studio Mitte
• Meine Antwort war hilfreich? Hinterlass bitte ein Like.
• Meine Antwort hat Dein Problem behoben? Bitte akzeptiere sie als Lösung.
• Ich hab dir etwas erspart? Ich freue ich mich immer über eine kleine Aufmerksamkeit
• Ja, ich biete Shopify-Services & -Entwicklung und freue mich von Dir zu hören!
• Bitte teile einen Link zu der Seite, deren Problem Du in deinem Beitrag beschreibst!

• Yes, I provide Shopify-services & -development. Feel free to get in touch!
• Please share a link to the site, which you refer to in your problem description. This incredibly increases the chances of you receiving a useful answer!
• My answer was useful? Please leave a Like.
• My answer solved your issue? Please accept it as the solution.
• I saved you time or money? I'm always happy to receive a little thank you.
0 Likes