Gulp

Gulp takes care of SCCS to CSS parsing and automatic FTP-deploy of changed files. Gulp also handles automation for boring tasks.

Only use gulp if the project are a Elastic-customer hosted in the FTP Secure setup

Note: Gulp will be slower than Grunt when used with a regular FTP-server.

Tasks

gulp Default task, will convert SCSS, concat JS, upload to FTP and watch.

gulp noftp Default task, will convert SCSS, concat JS, upload to FTP and watch.

gulp production SCSS-conversion without debugging. FTP upload, but no watch.

gulp ftpsync Will sync stage/images/responsive-base, stage/css & stage/scripts.

gulp package Will create a zip-package for restoring in Jetshop Admin.

gulp clean Will clean out unwanted OS generated files. Used by grunt package

FTP Config

Copy and rename the file .ftpconfig.js.sample to .ftpconfig.js

Edit the following variables:

host
user
password
shopAddress

FTP Sync

FTP will upload to:

stage/images/responsive-base
stage/css
stage/scripts

Adding gulp to an old repo

Add the following line to file .gitignore:

.ftpconfig.js

The following files need to copied from latest version of Responsive Base:

.ftpconfig.js.sample
gulp-config.js
Gulpfile.js
tools/utils/getSassBreakpoints.js

Manually diff and update file package.json

Run npm install again to fetch all the new dependencies

Copy .ftpconfig.js.sample to .ftpconfig.js

Edit .ftpconfig.js with credentials received from Jetshop Support

Test a dry-run with gulp noftp

Note: If the project is really old some paths in gulp-config.js might need to be updated

If all works, you can now use gulp!

Note: There will be minor changes from buildprocess to files responsive-base-modules.js, responsive-base-views.js and responsive-base.css. This is perfectly normal

Sync to multiple servers (test/production)

It is possible to direct the FTP sync towards different servers.

This is done by adding the argument --live to any gulp task: gulp --live

This requires a modified version of .ftpconfig.js

var gutil = require('gulp-util');
var argv = require('yargs').argv;
var config = {};

var isLive = !!(argv.live);
if(isLive){
    config = {
        "host": "upload.jetshop.se",
        "shopAddress": "customer.jetshop.se",   // used by browser-sync, no http:// prefix
        "user": "customer.jetshop.se",
        "password": "****",
        "ftpPath": "web/m1/",                   // path on FTP server
        "parallel": 1,
        "maxConnections": 1,
        "log": gutil.log,                     // enable this for more verbose logging
        "port": 21,
        "secure": true,
        "secureOptions": {
            "rejectUnauthorized": false
        }
    };
} else {
    config = {
        "host": "upload.jetshop.se",
        "shopAddress": "customer-test.jetshop.se",   // used by browser-sync, no http:// prefix
        "user": "customer-test.jetshop.se",
        "password": "****",
        "ftpPath": "web/m1/",                   // path on FTP server
        "parallel": 1,
        "maxConnections": 1,
        "log": gutil.log,                     // enable this for more verbose logging
        "port": 21,
        "secure": true,
        "secureOptions": {
            "rejectUnauthorized": false
        }
    };
}

module.exports = config;

Wiki

responsive-base / documentation / gulp