Το Sublime Text 3 είναι ένα από τα πιο δημοφιλή προγράμματα επεξεργασίας κειμένου για προγραμματιστές. Παρέχει στους χρήστες του μοναδικές δυνατότητες που δεν είναι διαθέσιμες πουθενά αλλού. Ένα από τα πιο σημαντικά πλεονεκτήματα είναι η πολλαπλή πλατφόρμα και η επεκτασιμότητα.
Εδώ μπορείτε να ρυθμίσετε τα πάντα - από την εμφάνιση έως τα στοιχεία προγράμματος (πρόσθετα). Αλλά το επίπεδο προσαρμογής στο Sublime Text είναι κατάλληλο - ως πρόγραμμα επεξεργασίας για προγραμματιστές, διαμορφώνεται μέσω του πηγαίου κώδικα, κάτι που δεν μπορούν να κάνουν όλοι. Σε αυτό το άρθρο, θα δούμε πώς διαμορφώνεται το Sublime Text 3.
Για το Sublime Text, από τις πρώτες κιόλας εκδόσεις, οι δυνατότητες ήταν πολύ μεγαλύτερες από ό,τι για άλλους συντάκτες. Είναι ένα αστείο - μια πλήρως προσαρμόσιμη διεπαφή, η δυνατότητα προσαρμογής της συμπεριφοράς του προγράμματος και όχι απλώς η εισαγωγή κειμένου; Τι μπορούμε να πούμε για τα πρόσθετα - ο κώδικας που είναι γραμμένος στην Python επιτρέπει στον χρήστη να ελέγχει τον επεξεργαστή με τον ίδιο τρόπο που ένας δαμαστής φιδιών, παίζοντας έναν μαγικό σωλήνα, κάνει έναν γιγάντιο βόα να τρέμει μπροστά του. Ωστόσο, όσο και αν λυπούμαστε, αυτό ακριβώς είναι που τρομάζει τους αρχάριους - επειδή δεν μπορούν να ρυθμίσουν το πρόγραμμα επεξεργασίας, σταματούν να το χρησιμοποιούν.
Ρύθμιση του Sublime Text 3
Αρχικά, ας μιλήσουμε για την εμφάνιση και, στη συνέχεια, ας προχωρήσουμε στη ρύθμιση των πλήκτρων πρόσβασης και των προσθηκών.
1. Εμφάνιση Υψηλού Κειμένου
Λοιπόν, ήρθε η ώρα να ξεκινήσετε το Sublime Text (άρθρο εγκατάστασης -). Σε πολλούς αρέσει ο σχεδιασμός του προγράμματος, ενώ σε άλλους όχι. Και τώρα έχετε μια μοναδική ευκαιρία να αλλάξετε τη διεπαφή πέρα από την αναγνώριση!
Ο πιο εύκολος τρόπος είναι να επιλέξετε ένα θέμα μέσω των ρυθμίσεων. Για να το κάνετε αυτό, μεταβείτε στο μενού "Προτιμήσεις" -> "Σχέδιο χρωμάτων"και επιλέξτε το θέμα που θέλετε. Αλλά αυτή η μέθοδος θα αλλάξει μόνο τα χρώματα του επεξεργαστή και τίποτα περισσότερο.
Μια άλλη, πιο περίπλοκη, αλλά σίγουρη επιλογή είναι να ασχοληθείτε με το αρχείο ρυθμίσεων. Για να το ανοίξετε, μεταβείτε στο μενού "Προτιμήσεις" -> "Ρυθμίσεις".Και τώρα, μπροστά σας δεν είναι παρά ένας όγκος κειμένου. Δεν είναι όμως όλα τόσο δύσκολα όσο φαίνονται! Στα αριστερά είναι οι προεπιλεγμένες ρυθμίσεις, δεν χρειάζεται να τις αγγίξετε. Μπορούν να ληφθούν ως παράδειγμα. Αλλά στα δεξιά πρέπει να τοποθετήσετε τις ρυθμίσεις σας - πάρτε, αντιγράψτε την επιθυμητή γραμμή και αλλάξτε την τιμή της. Βασικές ρυθμίσεις:
- "color_scheme"- έγχρωμο θέμα. Μπορείτε να επιλέξετε από τα υπάρχοντα ή μπορείτε να το κατεβάσετε στο φάκελο Πακέτα / Σχέδιο χρωμάτων - Προεπιλογή /.
- "font_face"- γραμματοσειρά κειμένου. Είναι σημαντικό να υπάρχει στο σύστημα. Για να δείτε τη λίστα με τις διαθέσιμες γραμματοσειρές, ανοίξτε οποιοδήποτε πρόγραμμα επεξεργασίας κειμένου, όπως το Lible Office Writer.
- "μέγεθος γραμματοσειράς"- μέγεθος γραμματοσειράς, ορίζεται ως κλασματική ή ακέραια τιμή.
- "font_options"- πρόσθετες επιλογές γραμματοσειράς όπως "no_bold", "no_italic".
- "word_separators"- διαχωριστικά λέξεων.
- "αριθμοί_γραμμών"- ρύθμιση αρίθμησης γραμμών.
- "υδρορροή"- εάν θα εμφανιστεί "ράβδωση"(περιέχει αριθμούς γραμμών και σελιδοδείκτες).
- "περιθώριο"- το μήκος της εσοχής από "αυλάκια".
- "fold_buttons"- αν περάσετε τον δείκτη του ποντικιού από πάνω "ράβδωση", θα είναι ορατά τριγωνικά βέλη, επιτρέποντάς σας να κρύψετε ή να εμφανίσετε ένα κομμάτι κώδικα ανάμεσα σε σγουρά άγκιστρα. Μπορείτε να τα ενεργοποιήσετε ή να τα απενεργοποιήσετε εδώ.
- "fade_fold_buttons"- εάν οριστεί σε false, τότε τα τριγωνικά κουμπιά δεν θα είναι κρυφά.
Ακολουθεί ένα παράδειγμα της ενέργειας ρυθμίσεων (μην ξεχάσετε να αποθηκεύσετε το αρχείο):
Μπορείτε να πειραματιστείτε εδώ μόνοι σας. Και προχωράμε.
2. Προσαρμόστε τις συντομεύσεις πληκτρολογίου
Ναι, ναι, καλά ακούσατε! Ο καθένας μπορεί να προσαρμόσει τους συνδυασμούς με τον δικό του τρόπο, εκχωρώντας τους διαφορετικές τιμές. Για να ανοίξετε το αρχείο, μεταβείτε στο "Προτιμήσεις" -> "Δεσμοί κλειδιών".
Έχουμε πάλι δύο αρχεία, το ένα εκ των οποίων είναι οι προεπιλεγμένες ρυθμίσεις και το άλλο οι προσωπικές σας ρυθμίσεις. Για να αλλάξετε τον συνδυασμό, πρέπει να αντιγράψετε μία ή περισσότερες γραμμές που περικλείονται ανάμεσα σε σγουρά τιράντες. Εδώ είναι ένα παράδειγμα του αρχείου μου:
Φυσικά, αυτό δεν αλλάζει τίποτα (είναι μια συντόμευση πληκτρολογίου για να κλείσετε οποιαδήποτε εφαρμογή), αλλά αυτό το αρχείο είναι απλώς ένα παράδειγμα.
Λοιπόν, αυτό ήταν όλο, το Sublime Text έγινε αυτό που χρειάζεστε και ξέρετε πώς να ρυθμίσετε το Sublime Text 3. Και τώρα ήρθε η ώρα να προχωρήσετε - να εγκαταστήσετε πρόσθετα.
3. Εγκατάσταση Package Control
Όπως αναφέρθηκε προηγουμένως, ο επεξεργαστής έχει τη δυνατότητα να προσθέτει πρόσθετα, είτε είναι δικά του είτε έχουν ληφθεί από τον ιστότοπο του προγραμματιστή. Ωστόσο, παρά τα πάντα, η μη αυτόματη εγκατάσταση προσθηκών δεν είναι πολύ βολική και επομένως πρέπει να κατεβάσετε και να εγκαταστήσετε ένα πρόσθετο στοιχείο.
Έλεγχος πακέτων - σχεδιασμένο για ταχύτερη και πιο βολική εγκατάσταση προσθηκών. Σας επιτρέπει να τα εγκαταστήσετε μέσω μιας διεπαφής απόδοσης και όχι μέσω κώδικα.
Πρώτα, εγκαταστήστε το Package Control από τον επίσημο ιστότοπο. Αυτό δεν σημαίνει ότι θα το κατεβάσουμε!
- Ας αντιγράψουμε το κείμενο από το αντίστοιχο πεδίο κειμένου (ανάλογα με την έκδοση του Sublime Text).
- Χρήση συντόμευσης πληκτρολογίου "Ctrl+~"καλούμε την κονσόλα ενσωματωμένη στον επεξεργαστή (ναι, υπάρχει κάτι τέτοιο!).
- Επικολλήστε τον αντιγραμμένο κώδικα στο πεδίο κειμένου και περιμένετε για επιτυχή εγκατάσταση.
- Κάνουμε επανεκκίνηση του επεξεργαστή.
Εγκαταστάθηκε ο έλεγχος συσκευασίας! Τώρα ήρθε η ώρα να μάθετε πώς να το χρησιμοποιήσετε.
4. Εργασία με πρόσθετα στο Package Control
Για να ξεκινήσετε το Package Control, πρέπει να πληκτρολογήσετε τη συντόμευση πληκτρολογίου "Ctrl+Shift+P"και επιλέξτε το στοιχείο ελέγχου πακέτου: Εγκατάσταση πακέτου από τη λίστα.
Και μπροστά μας είναι η πολυαναμενόμενη εγκατάσταση plugins! Τώρα είναι δυνατή η γρήγορη αναζήτηση και επιλογή τους και εάν επιλέξετε άλλες εντολές για τον Έλεγχο Πακέτων, μπορείτε να διαγράψετε και να αλλάξετε στοιχεία επεξεργασίας. Τώρα πρέπει να εξασκηθούμε στην εγκατάσταση. Ορίστε το θέμα Υλικό και διαμορφώστε το θέμα sublime text 3.
- Εκκινήστε το πρόγραμμα εγκατάστασης της προσθήκης.
- Πληκτρολογούμε στο πεδίο αναζήτησης Θέμα υλικού.
- Πατήστε και περιμένετε, θα εμφανιστεί μια επιγραφή παρακάτω "Εγκατάσταση θέματος υλικού πακέτου". Κατά τη διαδικασία εγκατάστασης, θα σας ζητηθεί να προσθέσετε ένα άλλο πρόσθετο, το επιτρέπουμε.
Για να εφαρμόσετε ένα θέμα, πρέπει να μεταβείτε στο μενού "Προτιμήσεις" -> "Σχέδιο χρωμάτων" -> "Θέμα υλικού" -> "σχήματα", και μετά το θέμα που σας αρέσει περισσότερο.
Ωστόσο, δεν είναι μόνο αυτό. Παρά την εγκατάσταση του θέματος ως πρόσθετο, δεν είναι πλήρως ενεργοποιημένο. Για να το διορθώσετε, μεταβείτε στο αρχείο ρυθμίσεων και προσθέστε το ακόλουθο κείμενο:
"θέμα": "Υλικό-Θέμα. sublime-theme",
"color_scheme": "Packages/Material Theme/schemes/Material-Theme.tmTheme",
"overlay_scroll_bars": "enabled",
"line_padding_top": 3,
"line_padding_bottom": 3,
// Σε αμφιβληστροειδή Mac
"font_options": [ "grey_antialias" ],
"always_show_minimap_viewport": true,
"bold_folder_labels": true,
// Επισημάνετε την ενεργή εσοχή
"indent_guide_options": [ "draw_normal", "draw_active" ]
Προβολή του επεξεργαστή μετά την εφαρμογή του θέματος σε αυτόν:
Δεν είναι κακό, σωστά; Η ρύθμιση του Sublime Text 3 έχει σχεδόν ολοκληρωθεί. Και τώρα ήρθε η ώρα να εδραιωθεί κάτι πιο ουσιαστικό. Ας ρίξουμε μια ματιά στα πιο δημοφιλή πρόσθετα για το Sublime Text.
Τα κορυφαία 5 πρόσθετα για το Sublime Text 3
1. Έμμετ
Το Emmet είναι ένα πρόσθετο που σας επιτρέπει να κάνετε την εμφάνιση κώδικα πιο βολική. Εδώ χρησιμοποιούνται συντομεύσεις πληκτρολογίου. Για παράδειγμα, "html+καρτέλα"δημιουργεί ένα πλαίσιο εγγράφου και " περιτύλιγμα div +καρτέλα"θα μετατραπεί σε πλήρη κωδικό:
Αυτή η προσθήκη είναι μια συλλογή από συντομογραφίες αποσπασμάτων για JavaScript. Το μήκος του πληκτρολογημένου κειμένου με τη βοήθεια υποδείξεων μειώνεται πραγματικά! Για παράδειγμα, αντί για ένα σετ "document.querySelector("επιλογέας");"μπορείτε απλά να πληκτρολογήσετε "qs+Tab".
Γιατί να αναζητήσετε μια θέση για ένα νέο αρχείο σε ένα άβολο δέντρο καταλόγου; Αυτό το πρόσθετο θα σας επιτρέψει να εισαγάγετε γρήγορα και αποτελεσματικά τα απαραίτητα δεδομένα και το αρχείο θα δημιουργηθεί με λίγα μόνο πλήκτρα!
4. Git
Το όνομα αυτού του πρόσθετου μιλάει από μόνο του: μπορείτε να εκτελέσετε όλες τις απαραίτητες ενέργειες μέσα στο Git χωρίς να φύγετε από το πρόγραμμα επεξεργασίας!
Γεια σας φίλοι! Σύμφωνα με τη δημοφιλή απαίτηση, ενημερώθηκε ο οδηγός γρήγορης εγκατάστασης για το πρόγραμμα επεξεργασίας κώδικα Υπέροχο κείμενο 3, εγκαθιστώντας τα πρόσθετα που είναι απαραίτητα για τη διάταξη και δημιουργώντας τη δική σας προεπιλογή για γρήγορη εκκίνηση σε έναν νέο χώρο εργασίας.
δροσερός
Καρφιτσώστε το
Πιθανότατα είστε εξοικειωμένοι με την κατάσταση όταν σε ένα νέο χώρο εργασίας πρέπει να εγκαταστήσετε και να διαμορφώσετε γρήγορα το Sublime Text για να εργαστείτε σε νέα έργα. Κατά κανόνα, η τελειοποίηση του Sublime Text απαιτεί πολύ χρόνο και η κάθε φορά δεν είναι πρακτική και χρονοβόρα.
Σήμερα θα δούμε την ταχύτερη ρύθμιση Sublime Text, τα πιο δημοφιλή plug-ins μεταξύ των σχεδιαστών διάταξης και θα εγκαταστήσουμε ένα από τα καλύτερα και πιο άνετα θέματα επεξεργασίας Θέμα One Dark Material.
Από προεπιλογή, το Sublime Text φαίνεται αρκετά λυπηρό:
Πρώτα πρέπει να ρυθμίσετε έλεγχος συσκευασίας. Για να το κάνετε αυτό, πατήστε το πλήκτρο συντόμευσης Ctrl+Shift+P. Στο αναδυόμενο παράθυρο, πληκτρολογήστε Install Package Control και επιλέξτε το κατάλληλο στοιχείο. Μετά από λίγα δευτερόλεπτα θα εγκατασταθεί το Package Control, για το οποίο θα λάβετε ειδοποίηση.
Εάν είστε χρήστης MacOS, πρέπει να πατήσετε Cmd + Shift + P στο πληκτρολόγιό σας.
Απαιτείται ο έλεγχος πακέτων για να μπορείτε να εγκαταστήσετε πρόσθετα και πρόσθετα στο Sublime Text 3 από το αποθετήριο πακέτων.
Εγκατάσταση πρόσθετων στο Sublime Text
Στη συνέχεια, πρέπει να εγκαταστήσετε τα πρόσθετα που χρειάζεστε για να εργαστείτε. Θα εξετάσουμε το ενδεχόμενο να εγκαταστήσουμε τα πιο δημοφιλή πρόσθετα μεταξύ των σχεδιαστών διάταξης, τα οποία απλοποιούν σημαντικά την ανάπτυξη. Μπορείτε επίσης να πειραματιστείτε με άλλες προσθήκες στον Έλεγχο πακέτων, ίσως σας αρέσουν μερικά από τα πολλά περισσότερα διαθέσιμα πακέτα.
Για να εγκαταστήσετε πρόσθετα στο Sublime Text μέσω του Package Control, πρέπει να καλέσετε το μενού, όπως κάναμε νωρίτερα: Ctrl + Shift + P. Στη συνέχεια, πληκτρολογήστε την εντολή "Εγκατάσταση πακέτου" και επιλέξτε το επιθυμητό πακέτο από τη λίστα.
Τα πιο δημοφιλή πρόσθετα για το Sublime Text:
- Έμμετ- επιταχύνει τη σύνταξη κώδικα HTML και CSS με την ταχύτητα του φωτός. Μάθημα από τον Έμμετ ;
- Αυτόματο Όνομα αρχείου- συμπληρώνει τον κώδικα κατά τη σύνταξη μονοπατιών προς αρχεία στη διάταξη.
- ουσία- Ενεργοποιεί το Sublime Text για χρήση της υπηρεσίας αποσπάσματος κώδικα GitHub Gist. Gist tutorial?
- Sass- πρόσθετο για την επισήμανση της σύνταξης Sass σε αρχεία Sass και Scss. Επεκτείνει το Emmet σε αρχεία Sass.
Εγκατάσταση του Sublime Text Appearance
Μου αρέσει πολύ το θέμα Θέμα One Dark Materialκαι τονίζοντας τον κωδικό με τον κατάλληλο συνδυασμό χρωμάτων. Αυτά είναι τα πιο ισορροπημένα, αρκετά αντίθετα, αλλά όχι πολύ έντονα χρώματα για άνετη εργασία στον επεξεργαστή.
Για να εγκαταστήσουμε το συνδυασμό χρωμάτων One Dark, πρέπει να εγκαταστήσουμε τα ακόλουθα πακέτα μέσω του Package Control:
- Ένα σχέδιο σκούρου χρώματος- συνδυασμός χρωμάτων για την επισήμανση κώδικα.
- One Dark Material - Θέμα- Θέμα UI Sublime Text.
Μη αυτόματη εγκατάσταση του πρόσθετου
Ορισμένες προσθήκες δεν ενημερώνονται πλέον στον Έλεγχο πακέτων ή απλώς δεν εμφανίζονται εκεί. Ορισμένες από αυτές τις προσθήκες είναι ζωτικής σημασίας όταν εργάζεστε με κώδικα και πρέπει να εγκατασταθούν με μη αυτόματο τρόπο.
Ένα από αυτά τα πρόσθετα BufferScroll- μια καταπληκτική προσθήκη που, όταν ανοίγετε ξανά το έγγραφο, θέτει τον κέρσορα στο σημείο όπου ολοκληρώσατε την επεξεργασία την τελευταία φορά, μειώνοντας έτσι τον χρόνο για να βρείτε τη σωστή θέση για να συνεχίσετε να εργάζεστε.
Για να εγκαταστήσετε το BufferScroll με μη αυτόματο τρόπο, μεταβείτε στη σελίδα GitHub της προσθήκης, πραγματοποιήστε λήψη και εξαγωγή του σε οποιαδήποτε βολική τοποθεσία στο δίσκο σας. Στη συνέχεια, στο Sublime Text, επιλέξτε το στοιχείο μενού Προτιμήσεις > Αναζήτηση πακέτων. Θα ανοίξει ο φάκελος δεδομένων χρήστη στη μονάδα δίσκου σας. Αντιγράψτε εδώ το φάκελο που περιέχει τα αρχεία Buffer Scroll και επανεκκινήστε το Sublime Text. Τώρα το πρόσθετο λειτουργεί.
Τροποποιώ το πρόγραμμα επεξεργασίας, προκαθορίζω τις ρυθμίσεις μου
Ας προχωρήσουμε στις ρυθμίσεις Sublime Text.
Παρουσιάζω την προεπιλογή μου, την οποία χρησιμοποιώ πάντα για να ξεκινήσω τη ρύθμιση του επεξεργαστή Sublime Text σε νέο χώρο εργασίας ή μετά από επανεγκατάσταση συστήματος. Μπορείτε να χρησιμοποιήσετε αυτήν την προεπιλογή στον επεξεργαστή σας και να την προσαρμόσετε όπως απαιτείται:
Keymap (Χρήστες Windows): [ ( "κλειδιά": ["alt+shift+f"], "command": "reindent" ), ] Ρυθμίσεις: ( "show_definitions": false, "auto_complete": false, "bold_folder_labels" : true, "color_scheme": "Packages/One Dark Material - Theme/schemes/OneDark.tmTheme", "fold_buttons": false, "font_size": 13, "highlight_line": true, "indent_guide_options": [ "draw_normal", "draw_active" ], "line_padding_bottom": 2, "line_padding_top": 2, "margin": 2, "material_theme_compact_sidebar": true, "material_theme_compact_panel": true, "material_theme_small_statusbar": "_the true,"Tabize_material" : 2, "theme": "OneDarkMaterial.sublime-theme", "word_wrap": "false", )
Προκαθορισμένος κώδικας για τις ρυθμίσεις χρήστη (Preferences.sublime-settings | Προτιμήσεις > Ρυθμίσεις) - ξεχωριστά:
( "show_definitions": false, "auto_complete": false, "bold_folder_labels": true, "color_scheme": "Packages/One Dark Material - Theme/schemes/OneDark.tmTheme", "fold_buttons": false, "font_size": , "highlight_line": true, "indent_guide_options": [ "draw_normal", "draw_active" ], "line_padding_bottom": 2, "line_padding_top": 2, "margin": 2, "material_theme_compact_sidebar": the true, "truemeelcom:pacterial_" , "material_theme_small_statusbar": true, "material_theme_small_tab": true, "tab_size": 2, "theme": "OneDarkMaterial.sublime-theme", "word_wrap": "false", )
Προκαθορισμένος κώδικας για προσαρμοσμένες συντομεύσεις πληκτρολογίου (Προεπιλογή (Windows). sublime-keymap | Προτιμήσεις > Key Bindings) - ξεχωριστά:
[ ( "πλήκτρα": ["alt+shift+f"], "command": "reindent" ), ]
Τώρα στην επιλογή και στο κλικ Alt+Shift+FΟ κώδικάς σας θα ευθυγραμμιστεί αυτόματα με την κατάλληλη ιεραρχία ένθεσης στοιχείων.
Τοποθετώντας αυτά τα αποσπάσματα στα κατάλληλα αρχεία ρυθμίσεων, θα λάβετε ένα εντελώς έτοιμο για εργασία, προσαρμοσμένο Sublime Text ή μπορείτε να προσαρμόσετε το πρόγραμμα επεξεργασίας για τον εαυτό σας. Υπάρχουν δύο πεδία στις ρυθμίσεις - το αριστερό με τις προεπιλεγμένες ρυθμίσεις και το δεξί με τις ρυθμίσεις χρήστη. Στις προεπιλεγμένες ρυθμίσεις, μπορείτε να δείτε συμβουλές για κάθε ιδιότητα και να τις εφαρμόσετε στη δεξιά πλευρά αντιγράφοντας και ορίζοντας την τιμή σας.
Το να μάθετε ποια ιδιοκτησία είναι υπεύθυνη για αυτό είναι πολύ απλό - όλα τα ακίνητα έχουν έξυπνα ονόματα στα αγγλικά. Οποιαδήποτε ιδιοκτησία από μια μεγάλη αφθονία διαθέσιμων ρυθμίσεων μπορεί απλά να μεταφραστεί στα ρωσικά και να κατανοήσει τι σημαίνει.
Για να δημιουργήσετε αντίγραφα ασφαλείας όλων των ρυθμίσεών σας και να αναπτύξετε γρήγορα το Sublime Text σε άλλο χώρο εργασίας, απλώς αντιγράψτε τον φάκελο
"C:\Users\(ο χρήστης σας)\AppData\Roaming\Sublime Text 3"
σε ένα κρυφό ρεζέρβα στο δίσκο σας ή σε μια μονάδα flash USB και, στη συνέχεια, τοποθετήστε το με άλλο χρήστη ή σε άλλον υπολογιστή στον ίδιο κατάλογο κάτω από τον χρήστη.
Επίσης, επιπλέον, κατά την κρίση σας, μπορείτε να απενεργοποιήσετε τον minimap στα δεξιά και να αποκρύψετε το μενού. Αυτό μπορεί να γίνει μεταβαίνοντας στο View > Hide Minimap και View > Hide Menu. Μπορείτε να εμφανίσετε το μενού πατώντας το πλήκτρο Ctrl στο πληκτρολόγιό σας.
// echo get_the_post_thumbnail(get_the_ID(), "relatedthumbnail"); // εμφάνιση του μεγέθους της μικρογραφίας μου;>Γεια σας, έχουν ήδη γραφτεί πολλά για το Sublime Text. Στο ιστολόγιό μου, έγραψα για το Sublime Text 2. Τώρα το Sublime Text 3 έχει ήδη εγκαταλείψει την άλφα έκδοση (άλφα σημαίνει μια νέα και εξαιρετικά ασταθής έκδοση) και μεταφέρθηκε σε beta (το beta δεν είναι ακόμα σταθερό, αλλά προορίζεται ήδη για δοκιμή, μετά την beta συνήθως έρχεται η επίσημη κυκλοφορία). Και αποφάσισα να ασχοληθώ πλήρως με το Sublime Text 3 (εφεξής ST3).
Εάν πρόκειται να εγκαταστήσετε το SublimeText3, τότε αυτός είναι ο πιο πλήρης οδηγός για εσάς. Εδώ θα περιγράψω όλα όσα σχετίζονται με αυτόν τον συντάκτη, και πραγματικά ξέρει πολλά.
Πρώτα, αφαίρεσα το ST2 και όλα τα ίχνη του από το σύστημα. Αφαίρεσε επίσης το node.js και το npm που αντιστοιχίστηκε με αυτό. Μιας και σκοπεύω να ρυθμίσω εκ νέου τη μεταγλώττιση των λιγότερων και στη συνέχεια αρχείων saas, σωστά και σωστά, μέσω του sublime. Αλλά περισσότερα για αυτό αργότερα.
Μέρος 1. Εγκατάσταση και διαμόρφωση του Sublime Text 3
Λήψη και εγκατάσταση του Sublime Text 3
Εάν δεν γνωρίζετε ήδη, το Less είναι ένας προεπεξεργαστής CSS που βασίζεται σε JavaScript. Αυτός είναι ο κώδικας που μεταγλωττίζεται στο CSS. Υπάρχουν διάφοροι τρόποι μεταγλώττισης λιγότερων στο css: Grunt , Guard και Less.app . Ωστόσο, ίσως δεν θέλετε ή δεν χρειάζεται να χρησιμοποιήσετε πρόσθετα εργαλεία και θέλετε να κάνετε τα πάντα σωστά στο πρόγραμμα επεξεργασίας κώδικα. Παρακάτω έχω δώσει οδηγίες που είναι κατάλληλες για χρήστες Windows (εγώ ο ίδιος έκανα την εγκατάσταση σε αυτό, αλλά και για mac OS.)
- Εγκαταστήστε το Node.js
- Εγκατάσταση NPM (εγκατεστημένο με το Node.js)
- Εγκαταστήστε το Less παγκοσμίως. Ανοίξτε την κονσόλα των Windows και πληκτρολογήστε npm install less -gd
- Εγκαταστήστε την προσθήκη Less2Css και το SublimeOnSaveBuild
Ας ανοίξουμε τις ρυθμίσεις ST3: Προτιμήσεις → Ρυθμίσεις - Προεπιλογή και προσθέστε τη γραμμή στο τέλος:
"lesscCommand": "/usr/local/share/npm/bin/lessc"
Ας ανοίξουμε οποιοδήποτε αρχείο .less και ας προσπαθήσουμε να το δημιουργήσουμε. Απλώς κάντε αλλαγές στο αρχείο και πατήστε Ctrl + S.
Εάν παρουσιαστεί σφάλμα: Δεν είναι δυνατή η ερμηνεία του ορίσματος clean-css…Αυτό συνέβη επειδή η προσθήκη clean-css ήταν ξεχωριστή και δεν περιλαμβανόταν στο λιγότερο πακέτο. Επομένως, πρέπει να εγκατασταθεί ξεχωριστά. Εγκαθιστώ. Πηγαίνουμε στην κονσόλα και γράφουμε:
npm εγκατάσταση -g less-plugin-clean-css
Το SASS είναι ένας άλλος προεπεξεργαστής CSS. Κερδίζει δημοτικότητα και ήδη ξεπερνά λιγότερο στην εξάπλωση της χρήσης.
- Εγκαταστήστε το Ruby
- Ξεκινάμε την κονσόλα και βάζουμε το Ruby Gem install sass
- Εγκατάσταση του πρόσθετου Sass για Sublime Text
- Εγκατάσταση της προσθήκης Sass Build for Sublime Text
- Εγκατάσταση της προσθήκης SublimeOnSave για το Sublime Text
(μιλήσαμε για αυτό το πρόσθετο στις παραπάνω οδηγίες)
Τώρα ας προσθέσουμε ρυθμίσεις στις Ρυθμίσεις Sublime Text - Προεπιλογή:
( "filename_filter": ".(sass|scss)$", "build_on_save": 1 )
Επίσης, μην ξεχάσετε να ανοίξετε το αρχείο .sass και να επιλέξετε το σύστημα κατασκευής στα Εργαλεία → Δημιουργία συστήματος → SASS Συμπιεσμένο Τώρα, όταν αποθηκεύσετε το αρχείο .sass, το .css θα μεταγλωττιστεί.
Το Jade είναι ένας προεπεξεργαστής για τη σύνταξη κώδικα html και, όπως το λιγότερο ή sass για το css, κάνει τη σύνταξη σήμανσης html ταχύτερη και ευκολότερη (για έμπειρους σχεδιαστές διάταξης). Πώς να εγκαταστήσετε και να ρυθμίσετε τη λειτουργία του.
- Πρέπει να έχει εγκατασταθεί το node.js με npm (συνήθως συνοδεύεται από κόμβο)
- Πηγαίνουμε στην κονσόλα και εγκαθιστούμε το jade με την εντολή npm install jade --global
- Εγκαταστήστε το πρόσθετο Jade Build στο Sublime Text
- Στο Sublime Text, ανοίξτε το αρχείο .jade και επιλέξτε Jade build system
- Εάν ακολουθήσετε όλες τις οδηγίες σε αυτήν την ανάρτηση, τότε στις ρυθμίσεις Sublime θα συμπληρώσω τη γραμμή σχετικά με το Save On Build με την επέκταση jade και τώρα θα μοιάζει με αυτό το "filename_filter": ".(sass|scss|jade)$" ,
- Εγκαταστήστε το πρόσθετο Jade στο Sublime
Μετά από αυτούς τους χειρισμούς, τα αρχεία jade μεταγλωττίζονται.
Εάν δεν υπάρχει επισήμανση κώδικα Jade, τότε μεταβείτε στην κάτω δεξιά γωνία του ST, και πιθανότατα λέει Απλό κείμενο, κάντε κλικ σε αυτήν την επιγραφή και, στη συνέχεια, επιλέξτε Επισήμανση Jade. Τώρα ο οπίσθιος φωτισμός θα λειτουργήσει.
Τα πρόσθετα Sublime Text είναι γραμμένα σε Python. Η ίδια η γλώσσα είναι πολύ απλή και αν είσαι προγραμματιστής, τότε δεν θα σου είναι δύσκολο να τη μάθεις. Αν όχι, τότε δεν έχει σημασία, καθώς πιθανότατα το πρόσθετο έχει ήδη γραφτεί για την εργασία σας.
Εγκατάσταση πρόσθετων στο Sublime Text
Προς το παρόν, υπάρχουν δύο μέθοδοι για την εγκατάσταση προσθηκών στο πρόγραμμα:
- Βαρβαρικός. Απλώς κατεβάστε το απαραίτητο πρόσθετο από το Διαδίκτυο και αποθέστε το στον κατάλληλο φάκελο. Αλλά αυτή δεν είναι σωστή μέθοδος, γι' αυτό δεν θα σταθούμε σε αυτήν.
- Μέσω Sublime Package Control
Πριν ξεκινήσετε την εγκατάσταση προσθηκών, πρέπει να εγκαταστήσετε το Sublime Package Control, διαβάστε σχετικά.
Για να εγκαταστήσετε πρόσθετα χρειάζεστε:
- ανοίξτε τη γραμμή εντολών πατώντας το συνδυασμό πλήκτρων: ctrl+shift+p ;
- στη γραμμή μπαίνουμε Install Package και πατάμε enter.
- στο κάτω μέρος, στο πεδίο που ανοίγει, πληκτρολογήστε το όνομα της προσθήκης, για παράδειγμα: emmet;
- πατήστε enter και περιμένετε να τελειώσει η εγκατάσταση, θα εμφανιστεί μια οθόνη με ένα σωρό γραμμές.
- Ετοιμος.
(δείτε οδηγίες σε 3 στιγμιότυπα οθόνης)
Δεν έχει πολύ νόημα να μιλάμε για το ποια πρόσθετα είναι δημοφιλή και ποια δεν έχουν πολύ νόημα, καθώς το Sublime γράφει σε πολλές δεκάδες γλώσσες προγραμματισμού και κάθε γλώσσα έχει τα δικά της πρόσθετα.
Αλλά επειδή η πλειοψηφία των ανθρώπων που επιλέγουν αυτόν τον επεξεργαστή γράφουν σε php, θα εξετάσουμε ακόμα μερικά.
Υπέροχο κείμενο Emmet
Λίγο νωρίτερα στο παράδειγμα, εγκαταστήσαμε αυτό το πρόσθετο. Επιταχύνει πολύ την ανάπτυξη των τοποθεσιών. Για να καταλάβετε τι κάνει στην κάτω δεξιά γωνία, αντί για Απλό κείμενο, επιλέξτε PHP. Τώρα βάζουμε το editor! και πατήστε TAB.
Μπορείτε επίσης να εισάγετε: .wrapper πατήστε καρτέλα, όπως βλέπουμε έχουμε ένα div.
Για να δημιουργήσετε ένα μενού με 10 συνδέσμους, μπορείτε να γράψετε τα εξής και, στη συνέχεια, να πατήσετε την καρτέλα: .menu>ul>li*10>a(menu_$)
Στην αριστερή πλευρά “!+tab” , στο κεντρικό τμήμα “.wrapper + tab”, και στη δεξιά πλευρά “menu>ul>li*10>a(menu_$) + tab” νομίζω ότι καταλαβαίνετε το νόημα.
Σύνθετο νέο αρχείο
Σας επιτρέπει να δημιουργήσετε νέα αρχεία. Εγκαταστήστε το πρόσθετο, ανοίξτε τη δεξιά πλαϊνή γραμμή (προβολή - πλαϊνή γραμμή - εμφάνιση πλαϊνής γραμμής), μετά πατήστε το συνδυασμό πλήκτρων ctrl + alt + n και γράψτε index.php, όπως βλέπουμε το αρχείο έχει δημιουργηθεί και είναι πολύ γρήγορο και βολικό.
Βάση επισήμανσης
Από προεπιλογή, αν στεκόμαστε, για παράδειγμα, σε κάποιο div, τότε είναι πολύ δύσκολο να παρατηρήσουμε την ετικέτα κλεισίματος, καθώς είναι υπογραμμισμένη πολύ αχνά. Βάση επισήμανσης.
Είναι αξιοσημείωτο ότι υπογραμμισμένο με φωτεινή λευκή γραμμή. έγχρωμο highlighter
Προτείνει το χρώμα του κώδικα, δηλαδή, από προεπιλογή, δεν μας είναι ξεκάθαρο τι χρώμα θα είναι ο κωδικός #224f43 και το πρόσθετο υπογραμμίζει τον κωδικό με το χρώμα που είναι. Επιπλέον, αν κάνουμε κλικ στον κωδικό, θα τον αναδείξει με αυτό το χρώμα.
Δήλωση Gotocs
Βοηθά να βρείτε και να μεταβείτε στο επιθυμητό στοιχείο css απευθείας από τον κώδικα html. Απλά πρέπει να κάνετε δεξί κλικ στο στοιχείο στο οποίο εφαρμόζεται αυτό το στυλ και να επιλέξετε Μετάβαση στη δήλωση CSS
Επεξεργαστής κειμένου μεταξύ πλατφορμών.
Ένας σύντομος οδηγός για αρχάριους να εργαστούν στο sublime και στον τομέα της διάταξης. Όλα όσα χρειάζεστε και χρειάζεστε είναι εδώ. (Κάντε κλικ στους συνδέσμους για περισσότερα εάν χρειάζεται)
Θα το εξετάσουμε για Layout on Pug / Less, όπου δεν χρειαζόμαστε τεράστια λειτουργικότητα εντοπισμού σφαλμάτων. Επομένως, είναι αυτός ο επεξεργαστής (κατά τη γνώμη μου) που κερδίζει τους ανταγωνιστές του τόσο σε ταχύτητα όσο και σε λειτουργικότητα.
1. Εγκατάσταση του προγράμματος και έλεγχος πρόσθετων (Έλεγχος πακέτου)
- Εγκαταστήστε το Sublime Text 3. Όλα είναι απλά - Κατεβάστεκαι ξεκινήστε.
Εδώ μπορούμε να κάνουμε λήψη, εγκατάσταση, κατάργηση, προβολή πρόσθετων κ.λπ.
2. Ρυθμίσεις προγράμματος:
- Χρησιμοποιήστε κενά αντί για καρτέλες.
"translate_tabs_to_space": true - Το μέγεθος της καρτέλας είναι 4 κενά.
tab_size: 4Ρωτάς γιατί;
Για να μην πιέσετε κατά λάθος το πλήκτρο διαστήματος και τη γλωττίδα μαζί και να μην σπάσετε το συγκρότημα πατημασιά.
Καθώς και για την ομοιομορφία της ομαδικής εργασίας. - Χορδές δεν θα έπρεπετελειώνει με κενούς χαρακτήρες.
Για να το κάνουμε αυτό, χρησιμοποιούμε το πρόσθετο TrailingSpaces .
- Ίσως εδώ τελειώνουν οι υποχρεωτικές ρυθμίσεις MustHave. Ας περάσουμε στο άτομο:
- F11 πλήρης οθόνη + απόκρυψη γραμμής μενού (alt).Σας επιτρέπει να μεγιστοποιήσετε τη χρήση της οθόνης για εργασία και να μην αποσπάται η προσοχή από την κατάσταση του πίνακα λειτουργικού συστήματος.
- Απαγόρευση διακοπής γραμμής.Ίσως το καλύτερο από τη λίστα. Αποτρέπει τη σύγχυση στη σύνταξη του pug. Εμφανίζει πάντα τον αναμενόμενο κώδικα και την ένθεση ανεξάρτητα από το μέγεθος της οθόνης. Η οριζόντια κύλιση γίνεται με shift + τροχό, (ή touchPanel)
"word_wrap": "false" - Θέματα.Δεν μπορώ να πω τίποτα για αυτό. Απλώς βρείτε αυτό που σας αρέσει (κατά προτίμηση χρησιμοποιώντας ένα σκοτεινό σχέδιο). Χρησιμοποιώ "θέμα": "Υλικό-Θέμα-Σκούρο.υψηλό-θέμα".
- Επισήμανση σύνταξης.Λοιπόν, δεν νομίζω ότι πρέπει να υπάρχει πρόβλημα. Εάν βεβαιωθείτε ότι η επέκταση και η επισήμανση ταιριάζουν (Pug για Pug, όχι Jade για Pug)
- Προβολή → Πλαϊνή γραμμή → Απόκρυψη ανοιχτών αρχείων- Απελευθερώνει χώρο για το δέντρο του έργου. Επειδή ούτως ή άλλως αυτό το πεδίο αντιγράφεται από καρτέλες και τρεις τελείες στην κορυφή
3. Χρήσιμα πλήκτρα πρόσβασης:
- Στην πρώτη παράγραφο, ας πούμε ότι παραλείπουμε όλους τους τυπικούς συνδυασμούς, όπως π.χ ctrl(⌘) + Z(⌘ - μετά απλώς ctrl). Αναίρεση, αποθήκευση, επανάληψη, κλείσιμο καρτέλας, καρτέλα επαναφοράς κ.λπ...
- Ίσως ο επόμενος πιο δημοφιλής συνδυασμός είναι:
crtl+P- Σας επιτρέπει να κάνετε αναζήτηση στα αρχεία του έργου που έχετε ανοίξει. Σας επιτρέπει να απαλλαγείτε από ένα τεράστιο δέντρο ανοιχτών στυλ. - Επόμενο σε σημασία:
ctrl + D- Αναζήτηση για αντίγραφα του επιλεγμένου κειμένου. Ιδανικό για πολλαπλή επεξεργασία. Και να βρω διπλότυπα. Ειδικά σε μεγαλύτερα αρχεία και μεγαλύτερα κομμάτια. Για πολλαπλούς δρομείς, κρατήστε πατημένο το ctrl και χρησιμοποιήστε το ποντίκι. - ctrl+L- Επιλέγει ολόκληρη τη γραμμή και σας επιτρέπει να τη διαγράψετε εντελώς. Λειτουργεί καλά με τα ctrl+D.
- Αναζήτηση…Λοιπόν, πιθανώς το πρώτο είναι το ctrl+F - αναζήτηση αρχείων. Το δεύτερο και πιο σημαντικό είναι να αναζητήσετε σε ένα φάκελο πολλά αρχεία ctrl + shift + F (Μπορείτε να το καλέσετε κάνοντας δεξί κλικ στον φάκελο και επιλέγοντας "Εύρεση στο φάκελο ...") Σας συμβουλεύω να μην συμπεριλάβετε το " Famous Fat Man» στην αναζήτηση
- ctrl+shift+επάνω/κάτω- Μετακινεί τη γραμμή επάνω/κάτω (ανταλλάξτε τα). Χρήσιμο για εργασία με στυλ και μεταβλητές.
- Τώρα ένα μικρό σεμινάριο για συνδυασμούς συντομεύσεων πληκτρολογίου. Έχετε δει πιθανώς αυτούς τους συνδυασμούς να χωρίζονται με κόμματα. Είδα λοιπόν ... και τώρα ξέρω πώς να τα χρησιμοποιήσω. Για να το κάνετε αυτό, πατήστε αυτούς τους συνδυασμούς με τη σειρά τους (δεν μπορείτε να απελευθερώσετε το κοινό πλήκτρο mod)
Εδώ είναι μερικά χρήσιμα: - ctrl+K, ctrl+4- Κρύβει όλα τα κλαδιά, των οποίων η φωλιά είναι μεγαλύτερη από 4. Ανάλογο του βέλους προς κατάρρευση. ( ctrl+K, ctrl+J- επεκτείνει ό,τι είναι)
- ctrl+K, ctrl+B- Αποκρύπτει/εμφανίζει το SideBar. (Λειτουργεί καλά με το F12)