Ccf NPM | npm.io

CCF (Compile Code Fast)

Compiles Javascript and SASS code into files that can be used in the browser

Install

You'll want to install ccf globally:

npm install ccf -g

NOTE: for this to work, you must also install SASS:

npm -g i sass

Usage

Once it's installed, just run ccf from any directory in your project that has an assets.json file!

ccf has some CLI options built into it by default. Use -h to see a list like this:

Option	Description
-p, --production	Run in production mode.
-j, --javascript	Only compile JavaScript code (SASS/CSS files are untouched).
-c, --css	Only compile Sass code into Css (JavaScript files are untouched).
-f, --force	Force a new version for all assets, even if nothing has changed.
-i, --ignore	Ignore cached source MD5s while compiling.
-g, --git	Add all compiled files to git automatically on completion.
-w, --watch	Watch source files for changes after completion.
-v, --verbose	Watch source files for changes after completion.
-h, --help	output usage information

You can use any number of options. For example:

ccf -fvp would start up ccf in production, verbose mode and force a version change.

You can also write your own commands using the ccfile.js as described in the "custom commands" section.

About "production"

Production turns on the following project options:

options.cssPrefix         = true;
options.compressCss       = true;
options.compressJs        = true;
options.addToGit          = true;
options.warnFilesNotSaved = true;

About "watch"

It's not advisable to use watch with production, force, ignore, or git.

It's very helpful if you are making frequent changes to some javascript files or SCSS files and you want to see the results right away.

Because of issues with working with cross-operating system file systems, there's a chance that it won't pick up your changes. Unfortunately, I don't think anything can be done about that. If you want to be sure you're running ccf, run it without watch. However, it should work 90% of the time.

Options

Here are the available options and their default values:

Option	default
versionTarget	"./public/build/"
jsSource	"./resources/assets/js/"
cssSource	'./resources/assets/sass/'
revManifest	'public/build/rev-manifest.json'
assets	'assets.json'
versionSuffix	(+new Date).toString(36)
cssPrefix	false
compressCss	false
compressJs	false
compileJs	true
compileCss	true
addToGit	false
onlyUpdateOnSourceChange	true
onlyUpdateOnResultChange	true // basically no reason to turn this off
deleteOldBuildFiles	true
runOnFileChange	false
warnFilesNotSaved	false // warn me every time a file is not saved for any reason
filesToScanForChanges	"resources/assets/js/", "resources/assets/sass/", "assets.json",
md5cacheFile	""
autoPrefixerOptions	{browsers : 'last 2 versions', cascade: false}
uglifyOptions	{ warnings : false, / setting this to `true` is quite verbose.../toplevel : true,output : {code: true / MUST be true, or the code doesn't get outputted. (which would be useless)/}sourceMap: {} / this is populated automatically, leave blank. If you don't want source maps, delete this line./}/https://www.npmjs.com/package/uglify-js#minify-options,/};
commands	[]
disableDefaultCommands	false

Any of these options can be overridden by placing a ccfile.js file in the project root directory, and exporting an options variable (see ccfile-example.js for an example)

Custom Commands

You can use the option.commands to create custom CLI options for your project. (see "options" about setting project options)

option.commands is an array of objects that look like this:

{
    name: "demoCommand",
    short: "d", // optional, uses the first letter of "name" if not given here. 
    description: "does the same thing as 'watch'", 
    callback: function(options) {
        options.runOnFileChange = true;
    }
}

You can use these custom commands to set custom option sets you frequently use.