node package manager



Unified frontend build pipeline for projects using the ShowCar UI Library


npm install showcar-gulp -D

Before starting

Install gulp

npm install gulp -D


Create your own gulpfile.js with the following structure

// gulpfile.js
const gulp = require('gulp');
const scgulp = require('showcar-gulp')(gulp);
// gulp tasks alliases
gulp.task('set-dev', () => {
    scgulp.config.devmode = true;
gulp.task('build', [
gulp.task('dev', ['set-dev', 'scss:watch', 'js:watch', 'serve']);
gulp.task('default', ['build']);

Build tasks

JS Build and minify your js files

gulp.task('js', scgulp.js({
    entry: 'src/main.js',
    out: 'dist/main.min.js'

SCSS Build and minify css from sass files

gulp.task('scss', scgulp.scss({
    entry: 'src/main.scss',
    out: 'dist/showcar.min.css'

TypeScript Build and minify your ts files

gulp.task('ts', scgulp.ts({
    entry: 'src/main.ts',
    out: 'dist/tsmain.min.js'

Linter tasks

Tasks for linting JS and CSS code style


gulp.task('eslint', scgulp.eslint({
    files: 'src/**/*.js'


gulp.task('tslint', scgulp.tslint({
    files: 'src/**/*.ts'


gulp.task('stylelint', scgulp.stylelint({
    files: 'src/**/*.scss'

For running linter tasks you will also need to create configuration files in your project.

.eslintrc.js for eslint task

.stylelintrc.js for stylelint task

Serve task

Runs a local server on localhost:3000 by default

gulp.task('serve', scgulp.serve({
    dir: 'dist'

Clean task

Removes files according to the files pattern

gulp.task('clean', scgulp.clean({
    files: ['dist/**/*']

Karma task

Runs karma tests

gulp.task('jstest' scgulp.js({
    entry: 'src/main.spec.js',
    out: 'dist/main.min.spec.js',
    watch: ['test-src/**/*.js', 'js-src/**/*.js'],
gulp.task('karma', ['jstest'], scgulp.karma({
    files: ['dist/index.spec.js']
gulp.task('jstest:watch', () => {['test-src/**/*.js', 'js-src/**/*.js'], ['karma']);

Usage example

Please see our gulpfile