O
O
Oleg2017-06-20 22:10:58
Node.js
Oleg, 2017-06-20 22:10:58

How to make a separate task for production build in Gulp?

There is a gulpfile that contains tasks. There is a build task that combines small tasks. There is a default task that runs build, watch and browsersync in turn.
The question is the following. For performance purposes, I would like to remove all operations unnecessary for work, such as prefixing, image compression, CSS and JS file compression, etc. And also add, for example, sourcemaps.
How can I make two tasks: the first for work, the second for production?
In fact, they are very similar, but slightly different. Is it really necessary to duplicate the entire code 2 times? I feel there is a smarter approach.

Answer the question

In order to leave comments, you need to log in

2 answer(s)
S
sergey, 2017-06-20
@r45her

Nothing needs to be duplicated, here is an example of my gulpfile.js:

// Configuring paths and options for different environments
env = process.env.NODE_ENV || 'dev';

if (env === 'dev') {
    outputDir = 'builds/development/';
    sassStyle = 'expanded';
    sassComments = true;
} else {
    outputDir = 'builds/production/';
    sassStyle = 'compressed';
    sassComments = false;
}

//и потом к примеру в стилях у меня 
....
.pipe(gulpIf(env !== 'dev', cleanCSS({compatibility: 'ie8'})))

// в js
...
.pipe(gulpIf(env !== 'dev', uglify()))
....
просто меняю env на === и собираю стили и скрипты для продакшн (оптимизированы)

и т.д по сути заменяя лишь значения с !== на === собираются 2 сборки: или builds/development /или builds/production/

D
Dark Hole, 2017-06-20
@abyrkov

Make a separate parameterized function, for example.
Do not forget that gulpfile is a full-fledged JS file, and you can do much the same with it.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question