Build System

CSS Lint uses a build system to make updating code faster and easier. Doing so allows a simple, clean directory and file structure that is easy to navigate and expand upon without needing to reference dozens of JavaScript files in a page. Understanding the build system is key to working with the CSS Lint source code.

Installing Node.js

The CSS Lint build system requires Node.js to run its unit tests. Go to http://nodejs.org to download and install the latest stable version for your operating system.

Most of the installers come with npm already installed, but if for some reason it doesn't work on your system, you can install it manually using the instructions on the website.

Installing Grunt

The CSS Lint build system is powered by Grunt. A getting started with Grunt guide can be found here, but the short version is:

npm install -g grunt-cli
npm install

The build targets

Grunt works by defining build targets. A target is really just a collection of steps to take. CSS Lint has several build targets:

• concat - builds the core CSS Lint JavaScript library
• changelog - automatically updates the CHANGELOG file with change information (admin use only)
• lint or jshint - runs lint tools on the source code to find possible errors
• release - prepares an official release by inputting version numbers and copying files to release directory (admin use only)
• test - builds everything, runs lint tools on the source code, and runs all unit tests on the command line
• rhino - builds everything, runs lint tools on the source code, and runs all unit tests in the Rhino/js.jar environment
• watch - watches for file changes and calls the related build tasks when files are saved.

In order to run a particular target, go into the csslint directory and use the following command:

grunt <target>

If you want to lint everything, type:

grunt lint

Since test is the default target, you can shorten this by simply typing:

grunt

When there is no target specified on the command line, Grunt will automatically use the default. test is the most frequently run target so it is set as the default.

Note: It's important that you run this command only in the csslint directory. Builds do not work in sub-directories.

The Gruntfile.js file

Grunt uses the Gruntfile.js to define targets and other related information. In general, you won't ever need to touch this file unless you're creating a new build target.

The property version number is defined in the package.json file. This version number is embedded in the source files when the release target is run. This value should not be changed except by the CSS Lint maintainers.

Workflow

Whenever you make changes to the CSS Lint source files, you'll need to run the concat target to regenerate the combined source files. The workflow is:

1. Make changes
2. Run grunt test to build and run tests on the command line

Alternately, you can use the Grunt watch task, which will rebuild and test CSS Lint when you save changes to any of the files.

If you want to run CSS lint on node against a specific css file during development, your workflow will need to be a bit different.

1. Make changes
2. Run grunt test to build and run tests on the command line
3. Run [sudo] npm link (in the release/npm dir)
4. Run csslint <options> <file-name>

You'll have to do this each time you make a change. It can be helpful to begin development using only tests, then when the code is more or less stable, test it against specific files.