gulp Handledning
Komma igång med gulp

Anmärkningar

versioner

Installation eller installation

1. Installera Node.js och NPM:

Gulp kräver Node.js och NPM, Nodes pakethantering. De flesta installatörer inkluderar NPM med Node.js. Se installationsdokumentationen eller bekräfta att den redan är installerad genom att köra följande kommando i din terminal,

npm -v
// will return NPM version or error saying command not found

2. Installera gulp globalt:

Om du tidigare har installerat en version av gulp globalt ska du köra npm rm --global gulp att se till att din gamla version inte kolliderar med gulp-cli .

$ npm install --global gulp-cli

3. Initiera din projektkatalog:

$ npm init

4. Installera gulp i ditt projektberoende:

$ npm install --save-dev gulp

5. Skapa en gulpfile.js i roten till ditt projekt:

var gulp = require('gulp');

gulp.task('default', function() {
  // place code for your default task here
});

6. Kör gulp:

$ gulp

Standarduppgiften körs och gör ingenting.

För att köra enskilda uppgifter använder du gulp <task> <othertask> .

Uppgiftsberoende

Du kan köra uppgifter i serie genom att skicka en andra parameter till gulp.task() .

Dessa parametrar är en rad uppgifter som ska köras och slutföras innan din uppgift körs:

var gulp = require('gulp');

gulp.task('one', function() {
   // compile sass css
});

gulp.task('two', function() {
   // compile coffeescript
});

// task three will execute only after tasks one and two have been completed
// note that task one and two run in parallel and order is not guaranteed
gulp.task('three', ['one', 'two'], function() {
   // concat css and js
});

// task four will execute only after task three is completed
gulp.task('four', ['three'], function() {
   // save bundle to dist folder
});

Du kan också utelämna funktionen om du bara vill köra ett paket med beroendeuppgifter:

gulp.task('build', ['array', 'of', 'task', 'names']);

Obs: Uppgifterna kommer att köras parallellt (alla på en gång), så anta inte att uppgifterna kommer att starta / slutföras i ordning. Starta gulp v4 , gulp.series() bör användas om ordningen för utförande av beroendeuppgifter är viktig.

Concat js-fil i undermapp med gulp

var gulp = require('gulp'); 

// include plug-ins
var uglify = require('gulp-uglify'),
    concat = require('gulp-concat');

// Minified file
gulp.task('packjsMin', function() {
   return gulp.src('node_modules/angular/*.js')
      .pipe(concat('script.js'))
      .pipe(uglify())
      .pipe(gulp.dest('Scripts'));
});

//Not minified file
gulp.task('packjs', function () {
    return gulp.src('node_modules/angular/*.js')
      .pipe(concat('allPackages.js'))
      .pipe(gulp.dest('Scripts'));
});

gulp CLI docs

flaggor

gulp har mycket få flaggor att veta om. Alla andra flaggor är avsedda att använda vid behov.

• -v or --version visar de globala och lokala gulpversionerna
• --require <module path> kräver en modul innan du kör gulpfilen. Detta är användbart för transpilerare men har också andra applikationer. Du kan använda flera - --require flaggor
• --gulpfile <gulpfile path> ställer in manuellt väg för gulpfile. Användbart om du har flera gulpfiles. Detta sätter CWD också till gulpfile-katalogen
• --cwd <dir path> ställer in CWD manuellt. Här söker man efter gulpfilen såväl som relativiteten hos alla
• -T eller - --tasks visar uppgiften beroende trädet för den laddade gulpfilen
• --tasks-simple visar en tydlig lista med uppgifter för den laddade gulpfilen
• --color kommer att tvinga gulp och gulp plugins att visa färger även om inget färgstöd detekteras
• --no-color kommer att tvinga gulp och gulp plugins att inte visa färger även om färgstöd detekteras
• --silent kommer att inaktivera all skogsavverkning

CLI lägger till process.env.INIT_CWD som är den ursprungliga cwd från vilken den lanserades.

Uppgift specifika flaggor

Se den här länken StackOverflow för hur du lägger till uppgiftsspecifika flaggor

uppgifter

Uppgifter kan utföras genom att köra gulp <task> <othertask> . Bara körning av gulp utför den uppgift du registrerade som kallas default . Om det inte finns någon default kommer gulp att fel.

kompilatorer

Du kan hitta en lista med språk som stöds vid tolkning . Om du vill lägga till stöd för ett nytt språk skicka dragförfrågan / öppna frågor där.