So installieren Sie SASS:

SASS oder Syntactically Awesome Stylesheets ist eine Erweiterung von CSS und hilft uns, flexiblere Stile zu schreiben. Dies erhöht die Leistung der Basissprache von CSS. SASS ist eine in CSS kompilierte Vorverarbeitungssprache mit unterschiedlichen technischen Syntaxen. Durch das Schreiben von Code in SASS können die Browser den Code nicht so interpretieren, als wäre dies kein richtiges CSS. Stattdessen benötigen wir einen Compiler, um den Code, den wir in CSS schreiben, zu vervollständigen, damit die Browser ihn interpretieren und verstehen können. Variablen, Mixins, verschachtelte Regeln, Inline-Importe usw. können in SASS mit kompatibler CSS-Syntax verwendet werden. Mit Hilfe der Kompass-Stilbibliothek sorgt Syntactically Awesome Stylesheets dafür, dass große Stylesheets übersichtlich bleiben und kleine Stylesheets in kürzester Zeit zum Laufen gebracht werden. Neben Funktionen wie vollständig CSS-kompatiblen Plattformen und Spracherweiterungen wie Verschachtelung, Mixins bietet WTC auch Funktionen wie viele wichtige Funktionen zum Bearbeiten von Farben und verschiedenen anderen Werten. Es hat auch andere erweiterte Funktionen wie Steueranweisungen für Bibliotheken, ordnungsgemäß formatierte, anpassbare Ausgaben und viele andere.

Unten finden Sie die Systemanforderungen für die Installation von Syntactically Awesome Stylesheets:

  • Betriebssystem - Es kann sich um ein beliebiges plattformübergreifendes Betriebssystem handeln.
  • Programmiersprache - Die Programmiersprache ist Ruby.
  • Browser - Es kann sich um einen beliebigen Browser wie Google Chrome, Internet Explorer, Safari, Mozilla Firefox, Oper usw. handeln.

Schritte zum Installieren von SASS:

Im Folgenden sind die Schritte zum Installieren des Pakets Syntactically Awesome Stylesheets im System aufgeführt:

Schritt 1:

Laden Sie die aktuelle stabile Version von Ruby über den folgenden Link herunter. Es wird eine Zip-Datei heruntergeladen, die zur weiteren Installation entpackt werden muss. Winzip oder 7zip können zum Entpacken der Datei verwendet werden.

https://www.ruby-lang.org/en/downloads/

Schritt 2:

Installieren Sie Ruby nach dem Entpacken nach dem Standardinstallationsverfahren auf dem System.

Schritt 3:

Fügen Sie den Ordner "Ruby bin" einer PATH-Benutzervariablen und der Systemvariablen hinzu, damit er mit dem gem-Befehl verwendet werden kann.
So fügen Sie die PATH-Variablen hinzu:

  1. Klicken Sie zunächst mit der rechten Maustaste auf das Computersymbol auf dem Desktop.
  2. Gehen Sie im Dropdown-Menü zu Eigenschaften.
  3. Klicken Sie anschließend auf die Registerkarte Erweitert und anschließend auf Umgebungsvariablen.
  • Doppelklicken Sie nach dem Öffnen des Fensters mit den Umgebungsvariablen oben in der Spalte mit den Variablen auf PATH. Unten ist der Screenshot zu sehen:

  • Wenn Sie auf PATH doppelklicken, wird das Fenster zum Bearbeiten der Benutzervariablen geöffnet. Fügen Sie den Ruby-Bin-Pfad im Wertefeld für die Variable als C: \ Ruby \ bin hinzu. Falls andere Pfade für andere Dateien festgelegt sind, setzen Sie einfach ein Semikolon und fügen Sie den Ruby-Pfad hinzu. Unten ist der Screenshot zu sehen:

  • Klicken Sie auf die Schaltfläche OK, um die Aufgabe abzuschließen.

Einstellen der Systemvariablen:

  • Unter dem System klickt die Variablenregisterkarte auf die neue Schaltfläche.
  • Danach öffnet sich das neue Systemvariablenfenster. Tragen Sie RubyOpt in das Feld für den Variablennamen und RubyGems in das Feld für den Variablenwert ein. Klicken Sie anschließend auf OK, um die Aufgabe abzuschließen. Unten ist der Screenshot zu sehen:

Schritt 4:

Führen Sie in der Eingabeaufforderung des Systems den Befehl gem install Scss aus. Dadurch wird sass im System installiert.

Schritt 5:

Nach erfolgreicher Installation von SASS wird der folgende Bildschirm angezeigt. Überprüfen Sie es, um eine Bestätigung zu erhalten.

Nachfolgend finden Sie ein Beispiel für eine grundlegende Implementierung von SASS.


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day


SASS example

Example
It is a bright and sunny day

Wir werden eine feine examples.css erstellen, die CSS ähnelt, vorausgesetzt, sie wird mit der Erweiterung .scss gespeichert. Dies muss zusammen mit den .htm-Dateien im Ruby-Ordner erstellt werden. Optional kann die Datei scss auch mit dem Ordnerpfad ruby ​​\ lib \ scss gespeichert werden. Erstellen Sie den Ordner sass im Ordner lib, bevor Sie die Datei scss erstellen.

h1( color: #AF80ED; ) h3( color: #DE5E85; )

SASS kann angewiesen werden, die Datei zu überwachen und das CSS zu aktualisieren, wenn Änderungen an der SCSS-Datei vorgenommen werden. Unten ist der Befehl:

sass --watch C:\ruby\lib\sass\ example.scss: example.css

Beim Ausführen des obigen Befehls wird automatisch eine example.css-Datei erstellt. Beim Ändern der scss-Datei wird die example.css-Datei automatisch aktualisiert.

Wenn Sie den obigen Befehl ausführen, wird die Datei example.css mit dem folgenden Inhalt erstellt.

h1( color: #AF80ED; ) h3( color: #DE5E85; )

Abgesehen von den obigen Schritten gibt es noch andere Möglichkeiten, SASS zu installieren:

Es gibt viele Anwendungen, die eine einfache und benutzerfreundliche Installation von SASS ermöglichen. Diese können aus dem Internet heruntergeladen werden. Davon sind nur wenige kostenlos, während andere bezahlt werden.

NPM kann auch zum Installieren von SASS verwendet werden, wenn der Benutzer node.js verwendet.

Somit kann in der obigen Schritt-für-Schritt-Anleitung SASS erfolgreich in einem System installiert werden. Unten ist der Befehl:

npm install -g sass

Beachten Sie jedoch, dass diese Installation eine reine JavaScript-Implementierung von Syntactically Awesome Stylesheets installiert, die vergleichsweise langsamer ist als die hier angegebenen Methoden, aber immer noch die gleiche Oberfläche wie die anderen Methoden aufweist. Im Falle von Langsamkeit ist es daher sehr einfach, zu einem späteren Zeitpunkt auf eine andere Implementierung umzuschalten, um die Geschwindigkeit zu erhöhen.

Falls ein Benutzer Chocolatey Package Manager für Windows ausführt, kann dart SASS installiert werden. Unten ist der Befehl:

choco install sass

Falls ein Benutzer den Homebrew-Paketmanager für Mac OS X verwendet, kann dart SASS installiert werden. Unten ist der Befehl:

brew install sass/sass/sass

Daher bietet SASS oder Syntactically Awesome Stylesheets neben so vielen Funktionen eine Vielzahl von Funktionen, mit denen Webseiten einfacher gestaltet werden können. SASS bietet verschiedene CSS-Erweiterungen wie verschachtelte Eigenschaften, Platzhalterauswahl usw. Es unterstützt auch SASS-Skripte, die eine interaktive Shell für die Programmierung sowie Unterstützung für verschiedene Variablen, Datentypen, Operationen, Funktionen, Interpolationen usw. bieten. Der Installationsprozess ist ebenfalls sehr einfach ausführen. Hinzufügen aller seiner Funktionen SASS bietet eine außergewöhnlich gute Plattform für das Webdesign und andere Anwendungen.

Empfohlene Artikel

Dies war eine Anleitung zur Installation von SASS. Hier haben wir den Schritt-für-Schritt-Prozess zur Installation von SASS erläutert. Sie können auch unsere anderen Artikelvorschläge durchgehen, um mehr zu erfahren -

  1. Komplette Anleitung zur Installation von .NET
  2. Wie installiere ich PostgreSQL?
  3. Verschiedene Schritte zur Installation von Typescript
  4. So installieren Sie Appium