Μεταγλωττιστής SCSS & Sass

Συγκεντρώστε επικολλημένα SCSS/Sass αποσπάσματα ή τοπικά αρχεία .scss/.sass απευθείας στο πρόγραμμα περιήγησής σας. Το φύλλο στυλ σας δεν μεταφορτώνεται, καταγράφεται ή αποστέλλεται σε API.

Κάντε κλικ για να επιλέξετε ένα αρχείο SCSS/Sass ή να το αποθέσετε εδώ

Μπορείτε επίσης να επικολλήσετε SCSS/Sass απευθείας στον παρακάτω επεξεργαστή.

0 byte

0 byte

Έτοιμο

Εγγενής συλλογή από το πρόγραμμα περιήγησης

Η μεταγλώττιση εκτελείται τοπικά χρησιμοποιώντας την επίσημη υλοποίηση Dart Sass. Δεν αποστέλλονται φύλλα στυλ σε διακομιστές Convertr.

Εισαγωγή αποσπάσματος και αρχείου

Επικολλήστε μερικό SCSS, πλήρη φύλλα στυλ, ένθετους κανόνες, μεταβλητές, μίξεις ή φορτώστε ένα τοπικό αρχείο .scss.

Ασφαλής μέτρηση

Το Analytics χρησιμοποιεί μόνο κουβάδες μεγέθους και μείωσης. Η πηγή SCSS, οι μεταβλητές, οι μίξεις και τα ονόματα αρχείων παραμένουν εκτός τηλεμετρίας.

Συχνές Ερωτήσεις

Έχει μεταφορτωθεί το SCSS μου στο Convertr;

Όχι. Ο μεταγλωττιστής SCSS εκτελείται τοπικά με JavaScript του προγράμματος περιήγησης. Το επικολλημένο SCSS και τα επιλεγμένα αρχεία δεν αποστέλλονται στους διακομιστές Convertr.

Τι συμβαίνει όταν το SCSS έχει συντακτικό σφάλμα;

Το σφάλμα μεταγλωττιστή με αριθμούς γραμμών και στηλών εμφανίζεται στον πίνακα προειδοποιήσεων, ώστε να μπορείτε να εντοπίσετε και να διορθώσετε το σφάλμα.

Υποστηρίζει @import ή απομακρυσμένες εξαρτήσεις;

Όχι. Για να διασφαλιστεί η ταχύτητα, η διαθεσιμότητα εκτός σύνδεσης και το απόρρητο, οι απομακρυσμένες εισαγωγές και η πρόσβαση στο σύστημα αρχείων είναι απενεργοποιημένες σε αυτόν τον εγγενή μεταγλωττιστή του προγράμματος περιήγησης.

Σχετικά εργαλεία προγραμματιστή

Ελαχιστοποιητής CSS Συμπίεση των φύλλων στυλ CSS Μετατροπέας χρώματος CSS Μετατροπή CSS χρωμάτων Γεννήτρια κλίμακας CSS Δημιουργία CSS gradients τοπικά Ελαχιστοποιητής HTML Συμπίεση HTML snippets Ελαχιστοποιητής JavaScript Συμπίεση κωδικού JavaScript Εργαλεία Ανάπτυξης Περιήγηση στα βοηθητικά προγράμματα περιήγησης

Μεταγλωττιστής SCSS

Μεταγλωττίστε υποστηριζόμενη σύνταξη SCSS σε CSS χρησιμοποιώντας τον ενσωματωμένο μεταγλωττιστή του προγράμματος περιήγησης.

Εισαγωγή
Πηγή SCSS και επιλογές output-style.
Έξοδος
μεταγλωττισμένο CSS ή διαγνωστικά μεταγλωττιστή.
Πραγματικοί περιορισμοί
Ο μεταγλωττιστής του προγράμματος περιήγησης δεν επιλύει αυθαίρετες εισαγωγές έργου, δεν εκτελεί build plugins ούτε εγγυάται ισοτιμία με διαφορετική έκδοση Sass.
Απόρρητο και επεξεργασία δεδομένων
Οι επιλογές πηγής SCSS και τρόπου εξόδου επεξεργάζονται σε αυτό το παράθυρο του προγράμματος περιήγησης. Ο μετατροπέας δεν λαμβάνει ή αποθηκεύει το στοιχείο αυτό. Το κλείσιμο ή η επαναφόρτωση της σελίδας καθαρίζει την κατάσταση εργασίας, εκτός εάν το εργαλείο προσφέρει ρητά μια τοπική λήψη.

Πώς να χρησιμοποιήσετε αυτό το εργαλείο

  1. Παρέχετε πηγή SCSS και επιλογές output-style στα χειριστήρια του εργαλείου.
  2. Επιλέξτε τις ρυθμίσεις που επηρεάζουν το μεταγλωττισμένο CSS ή τα διαγνωστικά του μεταγλωττιστή, στη συνέχεια εκτελέστε το εργαλείο.
  3. Εξετάστε το μεταγλωττισμένο CSS ή τα διαγνωστικά του μεταγλωττιστή πριν από την αντιγραφή ή τη λήψη.

Κοινοί τρόποι αποτυχίας

Οι αόριστες μεταβλητές, τα mixins που λείπουν, οι μη διαθέσιμες εισαγωγές ή η μη έγκυρη ένθεση επιστρέφουν ένα σφάλμα μεταγλώττισης με αναφορά γραμμής.

Χρήσιμο παράδειγμα

Μεταγλωττίστε μια μεταβλητή $brand και έναν ένθετο κανόνα .button hover σε διευρυμένο ή συμπιεσμένο CSS.