Gruntify is a project inspired by Makefy. It's a shortcut that I use in my projects, in order to facilitate the configuration of projects that uses Grunt.
That's a sweet way to use Grunt. You'll install once all dependencies in development environment, define your tasks, set your configuration and build it. All the tasks are well commented with specific options for each plugin.
TODO LIST: you can check updates notes here
So, It's quite simple to get start. Check the following steps to set up your gruntfile with Gruntify.
First of all, make sure you have NodeJS and Grunt CLI installed. If you want to use Bower, make sure you have it installed too.
New project
# 1. Clone this repository and access the new project directory
$ git clone git://github.com/vitorbritto/gruntify.git [projectname]
$ cd [projectname]
# 2. Execute the makefile
$ make new
# 3. Set up your configuration
# 4. Profit!
Existing Project (non Grunt project)
# 1. Clone this repository (make sure to be inside your project directory)
$ git clone git://github.com/vitorbritto/gruntify.git
# 2. Execute the makefile
$ make current
# 3. Set up your configuration
# 4. Profit!
Configuration:
The config.js
file contain all the necessary settings for your build process. Check out a detailed diagram of the initial configuration:
// -------------------------------------------------------------------------------------
// INITIAL CONFIGURATION
// -------------------------------------------------------------------------------------
// Setup
init: {
// Select a Template Engine - OPTIONS: none, jade, handlebars
view: 'none',
// Select a preprocessor - OPTIONS: none, compass, stylus, less
style: 'stylus',
// Select a JavaScript module - OPTIONS: none, umd, requirejs, browserify
module: 'none',
// Select a deploy method - OPTIONS: none, ftp-deploy, rsync
deploy: 'none',
// Select a unit test tool - OPTIONS: none, mocha, jasmine, qunit
test: 'none',
// Would you like to use Karma?
karma: true,
// Select a development side - OPTIONS: client, server, both
side: 'client'
},
// Folders
modules: 'app/scritps/modules',
requires: 'app/scripts/requires',
test: {
main: 'spec',
helpers: 'spec/helpers',
modules: 'spec/modules'
},
dist: {
main: 'public',
styles: 'public/styles',
scripts: 'public/scripts',
images: 'public/images',
fonts: 'public/fonts'
},
src: {
main: 'app',
views: 'app/views',
styles: 'app/styles',
scripts: 'app/scripts',
images: 'app/images',
fonts: 'app/fonts'
},
// -------------------------------------------------------------------------------------
// TASKS CONFIGURATION
// -------------------------------------------------------------------------------------
// Browser Sync
syncFiles: [
'public/styles/style.css',
'public/scripts/app.min.js',
'public/*.{php, html}'
],
// Uglify
minifyFiles: ['app/scripts/**/*.js'],
// Lint
lintFiles: ['Gruntfile.js', 'app/scripts/main.js'],
// Deploy
deploy: {
host: 'ftp.domain.com',
port: 21,
src: 'public/',
dest: 'public/www',
ignore: [
'.git*',
'*.scss',
'node_modules'
]
},
// Modules
transforms: [
'hsbfy',
'es6fy',
'coffefy',
'debowerify',
'decomponentify',
'deamdify',
'deglobalify'
],
dependencies: {
'default': [''],
global: ['jquery'],
amd: [''],
cjs: ['']
},
// Banner
banner: '\n' +
'/*\n' +
' * -------------------------------------------------------\n' +
' * ' + pkg.title + ' - v' + pkg.version + '\n' +
' *\n' +
' * Copyright (c) <%= grunt.template.today(\"yyyy\") %> ' + pkg.author.name + '\n' +
' * -------------------------------------------------------\n' +
' */\n' +
'\n'
Available tasks:
grunt
: Initialize and watch for changesgrunt styles
: Optimize CSSgrunt scripts
: Optimize JSgrunt views
: Compile HTMLgrunt images
: Optimize Imagesgrunt test
: Test your applicationgrunt deploy
: Deploy for productiongrunt bundle
: Bundle Assets with AMD, CJS or UMDgrunt build
: Build projectgrunt launch
: Test, Build files and deploy for productiongrunt update
: Release a new version on github
During install some of you may encounter some issues, most of this issues can be solved by one of the following tips. If you went through all this and still can't solve the issue, feel free to contact us via the repository issue tracker or the links provided below.
Sometimes you may find there is a weird error during install like npm's Error: ENOENT, usually updating those tools to the latest version solves the issue.
Updating NPM:
$ npm update -g npm
Updating Grunt:
$ npm update -g grunt-cli
Updating Bower:
$ npm update -g bower
NPM and Bower has a caching system for holding packages that you already installed. We found that often cleaning the cache solves some troubles this system creates.
NPM Clean Cache:
$ npm cache clean
Bower Clean Cache:
$ bower cache clean
MIT License © Vitor Britto