Um CSS- und JavaScript -Dateien ( JS ) in der Befehlszeile Linux zu komprimieren, k?nnen Sie zwei effektive Tools verwenden: UglifyJS für JavaScript und UglifyCSS für CSS .

Durch die Komprimierung werden unn?tige Zeichen aus dem Quellcode wie Leerzeichen, Registerkarten, Zeilenunterbrechungen und Kommentare ausgezogen, wodurch die Dateigr??e verringert wird, ohne die Funktionalit?t zu beeintr?chtigen. Dies kann die Ladegeschwindigkeit von Webanwendungen verbessern.

Dieser Artikel führt Sie durch die Schritte, um CSS- und JS -Dateien mithilfe der Linux -Befehlszeilenschnittstelle (CLI) mit UglifyJs und UglifyCSS zu komprimieren.

Schritt 1: Einrichten von Node.js und NPM unter Linux

Stellen Sie sicher, dass Node.js und NPM (Node Package Manager) vor dem Fortfahren auf Ihrem Linux -System installiert sind.

 <code>node -v npm -v</code>

Wenn sie nicht installiert sind, k?nnen Sie sie mit diesen Befehlen auf Debian-basierten Systemen einrichten:

 <code>sudo apt update sudo apt install nodejs npm -y</code>

Verwenden Sie für rhelbasierte Systeme:

 <code>sudo dnf update sudo dnf install nodejs npm -y</code>

Schritt 2: Einrichten von Uglifyjs und UglifyCSS

Mit Node.js und NPM k?nnen Sie Uglifyjs und UglifyCSS installieren, die NPM -Pakete sind, die für die Komprimierung von JavaScript- und CSS -Dateien entwickelt wurden.

 <code>sudo npm install -g uglify-js sudo npm install -g uglifycss</code>

überprüfen Sie die Installation von Uglifyjs und UglifyCSS , indem Sie ausgeführt werden:

 <code>uglifyjs -V uglifycss -V</code>

Schritt 3: Komprimieren von JavaScript- und CSS -Dateien

Um eine JavaScript- oder CSS -Datei zu komprimieren, navigieren Sie zu dem Verzeichnis, das die Datei enth?lt, die Sie komprimieren und ausführen m?chten:

 <code>uglifyjs yourfile.js -o yourfile.min.js uglifycss yourfile.css > yourfile.min.css</code>

Verwenden Sie für die Komprimierung mehrerer CSS- und JS -Dateien in einem Verzeichnis ein Bash -Skript, mit dem die Leistung Ihrer Website durch Reduzierung der Dateigr??en verbessert werden kann.

Komprimierung mehrerer JavaScript -Dateien

Erstellen Sie ein Bash -Skript, um alle JS -Dateien zu komprimieren.

 <code>nano compress_js.sh</code>

Fügen Sie das folgende Skript in die Datei compress_js.sh ein:

 <code>#!/bin/bash for file in *.js; do if [ "$file" != "${file%.min.js}" ]; then echo "Skipping compressed file: $file" continue fi uglifyjs "$file" -o "${file%.js}.min.js" --compress --mangle echo "Compressed $file to ${file%.js}.min.js" done</code>

Machen Sie das Skript ausführbar und führen Sie es aus.

 <code>chmod x compress_js.sh ./compress_js.sh</code>

Dieses Skript wird durch alle .js -Dateien im Verzeichnis iteriert, sie mithilfe von Uglifyjs komprimiert und neue Dateien mit der Erweiterung .min.js generiert.

Wenn Sie es vorziehen, keine neuen Dateien zu generieren, k?nnen Sie das BASH -Skript so ?ndern, dass die Originaldateien mit der Option -o überschreiben.

 <code>#!/bin/bash for file in *.js; do if [ "$file" != "${file%.min.js}" ]; then echo "Skipping already compressed file: $file" continue fi uglifyjs "$file" --compress --mangle -o "$file" echo "Compressed $file" done</code>

Komprimierung mehrerer CSS -Dateien

Um alle CSS -Dateien in einem Verzeichnis zu komprimieren, erstellen Sie ein Bash -Skript.

 <code>nano compress_css.sh</code>

Fügen Sie der Datei compress_css.sh das folgende Skript hinzu:

 <code>#!/bin/bash for file in *.css; do if [ "$file" != "${file%.min.css}" ]; then echo "Skipping compressed file: $file" continue fi uglifycss "$file" > "${file%.css}.min.css" echo "Compressed $file to ${file%.css}.min.css" done</code>

Machen Sie das Skript ausführbar und führen Sie es aus.

 <code>chmod x compress_css.sh ./compress_css.sh</code>

Dieses Skript wird durch alle .css -Dateien im Verzeichnis iteriert, sie mithilfe von UglifyCSS komprimiert und neue Dateien mit der Erweiterung .min.css erstellt.

Wenn Sie es vorziehen, keine neuen Dateien zu erstellen, k?nnen Sie das folgende Bash -Skript verwenden, um die Originaldateien zu überschreiben.

 <code>#!/bin/bash for file in *.css; do if [ "$file" != "${file%.min.css}" ]; then echo "Skipping already compressed file: $file" continue fi uglifycss "$file" > temp.css mv temp.css "$file" echo "Compressed $file" done</code>

Abschluss

Das Komprimieren Ihrer CSS- und JS -Dateien ist eine einfache Aufgabe mit UglifyJS und UglifyCSS auf der Linux -CLI. Dies reduziert nicht nur die Dateigr??en, sondern tr?gt auch zu schnelleren Ladezeiten der Webseite bei.

Das obige ist der detaillierte Inhalt vonSo miniieren Sie CSS- und JS -Dateien mithilfe von Uglifyjs und UglifyCSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!