gulpit
v1.0.72
Published
Gulpit is an easy and fast configurable task library built around Gulp useable with a CLI
Downloads
7
Maintainers
Readme
Gulpit
Gulpit is an easy and fast configurable task library built around Gulp useable with a CLI. You just have to configure the 'gulpit-conf.js' file (< 2min). You will find a sample below.
How do I get set up?
- Install the package with NPM:
npm install --global gulpit
- Create a 'gulpit-conf.js' file in the root of your project
cd
where the 'gulpit-conf.js' is then run:gulpit
How do I use the CLI?
You have two main command when you are in the gulpit app:
Build
: will build your files oncewatch
: will watch for file modifications then build after each new savehelp
: List the command available with descriptions
You have extra options like:
build --css
: will only build cssbuild --prod
: will build with the prod profile*
You can combine:
build --js --prod
: will only build js with the prod profile*
*Prod profile: will override the default options.
Which tools can I use?
For Javascript:
- Browserify
- Uglify (you can use both Browserify and Uglify)
- Sourcemaps
For CSS:
- Sass
- Less
- Sourcemaps
- Autoprefixer
Sample 'gulpit-conf.js'
Here is an example of a specific config if you use browserify (with sourcemaps) and sass (with sourcemaps and autoprefixer):
module.exports = {
projectName: 'test-project',
profiles: {
default: {
js: {
sourceFolder: 'dev/js/browserify/index.js',
exitFolder: 'build/js/',
exitFileName: 'app.js',
tasks: {
browserify: { activate: true },
sourcemaps: { activate: true }
}
},
css: {
sourceFolder: 'dev/css/sass/index.scss',
exitFolder: 'build/css/',
exitFileName: 'style.css',
tasks: {
sass: {
activate: true,
options: {
outputStyle: 'nested'
}
},
autoprefixer: {
activate: true,
options: {
browsers: ['last 2 versions']
}
},
sourcemaps: { activate: true }
}
}
},
// Optional prod profile to disable sourcemaps
// when you use '--prod' argument in the CLI
prod: {
js: { sourcemaps: { activate: false } },
css: { sourcemaps: { activate: false } }
}
}
};
You can find the complete sample conf with all the tasks available in the test folder of this repo.
Extra info
The different options for sass.options.outputStyle are: nested, expanded, compact, compressed
If you use both Browserify and Uglify, the uglify.options.concat options will be ignored as browserify already concat all the files
File will be renamed after build only if you indicate a specific file for sourceFolder
You can the use prod profile by setting your NODE_ENV to "prod" instead of using the
--prod
option.