Gulp Cheatsheet¶
Gulp è un toolkit per automatizzare le attività dolorose o che richiedono tempo nel flusso di lavoro di sviluppo, in modo da poter smettere di fare casino e costruire qualcosa. Esso utilizza i flussi Node.js, rendendo le build più veloci evitando la necessità di scrivere file temporanei su disco. Traduzione:
Traduzione: __HTML_TAG_67_📋 Copia Tutti i comandi_HTML_TAG_68_
Tavola dei contenuti¶
- Installazione Getting Started
- Core Concepts
- No, no.
- File Operations
- CSS Processing
- JavaScript Processing
- Image Optimization
- HTML Processing
- Server di sviluppo
- Attrezzature Build Pipeline
- Plugin Ecosystem
- No, no.
- Ottimizzazione delle prestazioni [Error Handling] Testing
- Deployment Le migliori pratiche
Installazione¶
Installazione globale¶
Traduzione:
Installazione locale¶
Traduzione:
Progetto Setup¶
Traduzione:
Package.json Scripts¶
Traduzione:
¶
Basic Gulpfile¶
Traduzione:
Running Tasks¶
Traduzione:
Struttura del progetto¶
Traduzione:
Core Concepts¶
# Streams and Pipes¶
Traduzione:
Glob Patterns¶
Traduzione:
Funzioni di attività¶
Traduzione:
Serie e parallelo¶
Traduzione:
Compiti di base¶
Copia file¶
Traduzione:
Pulizia file¶
¶
Rinominazione del file¶
Traduzione:
Operazioni di file¶
Concatenazione dei file¶
Traduzione:
Filtro file¶
Traduzione:
Trasformazione file¶
Traduzione:
CSS # Lavorazione¶
Sass Compilation¶
Traduzione:
PostCSS # Lavorazione¶
Traduzione:
Ottimizzazione CSS¶
Traduzione:
JavaScript Lavorazione¶
JavaScript di base Lavorazione¶
Traduzione:
Elaborazione script¶
Traduzione:
JavaScript Bundling¶
Traduzione:
JavaScript Fodera¶
Traduzione:
Ottimizzazione immagine¶
Elaborazione di immagini di base¶
Traduzione:
# Advanced Image Processing¶
Traduzione:
Elaborazione HTML¶
HTML Minification¶
Traduzione:
Convalida HTML e elaborazione¶
Traduzione:
Development Server¶
Impostazione server di base¶
Traduzione:
Configurazione server avanzata¶
Traduzione:
Live Reload¶
Traduzione:
Watch Tasks¶
Set di orologi di base¶
Traduzione:
Advanced Watch Patterns¶
Traduzione:
Guarda con la gestione degli errori¶
Traduzione:
# Build Pipeline¶
Development Build¶
¶
Production Build¶
Traduzione:
Multi-Environment Builds¶
Traduzione:
Plugin Ecosystem¶
Plugin essenziali¶
Traduzione:
Plugins di elaborazione file¶
Traduzione:
# Testing Plugins¶
Traduzione:
Deployment Plugins¶
Traduzione:
Modelli avanzati¶
Plugin personalizzati¶
Traduzione:
# Stream Processing¶
Traduzione:
Elaborazione condizionale¶
Traduzione:
Ottimizzazione delle prestazioni¶
Elaborazione parallela¶
Traduzione:
Incremental Builds¶
Traduzione:
Ottimizzazione della memoria¶
Traduzione:
Gestione degli errori¶
Gestione di errori di base¶
Traduzione:
Gestione degli errori avanzata¶
Traduzione:
Testing¶
Unit Testing¶
Traduzione:
Integration Testing¶
Traduzione:
¶
Costruire e distribuire la tubatura¶
Traduzione:
CI/CD Integrazione¶
Traduzione:
Migliori Pratiche¶
Project Organization¶
Traduzione:
Gestione configurazione¶
Performance Best Practices¶
- **Utilizzazioni incrementali ** con
gulp-changedogulp-newer__ - **Esecuzione parallela ** per compiti indipendenti
- *Cache costose operazioni * con __INLINE_CODE_57_
- ** Utilizzare lo streaming** invece di bufferizzare i file di grandi dimensioni
- Ottimizzare i modelli di orologi per evitare inutili ricostruzioni
Codice Qualità Migliori Pratiche¶
- Implement linting per CSS, JavaScript e HTML
- ** Utilizzare mappe di origine** per il debug nello sviluppo
- **Aggiungi la gestione degli errori ** con
gulp-plumber - ** Includi i test** nella tua pipeline di costruzione
- ** Documenti i tuoi compiti** e configurazione
Manutenzione Migliori Pratiche¶
- I plug-in aggiornati regolarmente
- ** Utilizzare la versione semantica** per le tue costruzioni
- Implementa il corretto ingaggio per il debug
- Crea file di attività modulari per una migliore organizzazione
- ** Utilizzare variabili di ambiente** per la configurazione sensibile
Sommario¶
Gulp è un potente sistema di creazione di streaming che eccelle nell'automazione delle attività ripetitive nello sviluppo web. Le caratteristiche principali includono:
- Stream-based Processing: Efficiente elaborazione dei file senza file temporanei
- Code over Configuration: configurazione basata su JavaScript per la massima flessibilità
- Rich Plugin Ecosystem: Migliaia di plugin per ogni compito concepibile
- Elaborazione Parallel. Eseguire le attività contemporaneamente per le build più veloci
- Ricarica e Ricarica dal vivo: Ricostruzioni automatiche e aggiornamento del browser
- Costruzioni ambientali: Processo solo i file modificati per la velocità
- Error Handling: Robusta gestione degli errori per evitare guasti di costruzione
- Extensible: Facile da creare plugin e attività personalizzate
Levando l'architettura di streaming di Gulp e l'esteso ecosistema plugin, è possibile creare processi di costruzione efficienti e manutenbili che si ingrandiscono con la complessità del progetto.
__HTML_TAG_73_ copia funzioneToClipboard() {} const commands = document.querySelectorAll('code'); tutti i Comandi = ''; comandi. per ogni(cmd => AllCommands += cmd.textContent + '\n'); navigatore.clipboard.writeText(tutti iComandi); alert('Tutti i comandi copiati a clipboard!');
¶
funzione generaPDF() { finestra.print();
¶
__HTML_TAG_74_