compile-watch is the latest Atom package I’ve been working on, it is the successor to sass-watch and takes over all the functionality of sass-watch whilst adding a lot more.

The primary improvement is that it is able to compile any kind of file as long as there is a format defined for it. So as an example I’m going to detail how I added LESS support in this post.

### Step 1 the test

The first and by far most important step is to add a test for your new format.

Since LESS will be compiled _in-process_ by Atom it will work the same as Coffee Script so the quickest solution is to copy the Coffee Script test and change coffee/js to less/css resulting in this:

At this point that test will fail obviously so now its time to add the new format.

### Step 2 add less as a dependancy

Add "less" : "2.5.0" to package.json and run apm install. Less is now installed into node_modules and is ready to be used.

### Step 3 writing the format

Create an empty file at lib/formats/less.coffee and open it.

#### Requires

At the top of the file we need to require LESS,the format class and fs.

#### Format Class

Next we need to define a format class which will look like this:

#### Register the format

Now at the bottom of the file the class needs to be registered as the compiler for less.

### Step 4 run the test

Run the package specs and make sure that the LESS format works as it should and that nothing else has been broken by adding the LESS format.

### Open a pull request

Open a pull request on the github repository I will merge it assuming everything looks right with it.

You can view the full commit here which has everything I added in.

Creating the Less compiler for compile-watch

This site uses Akismet to reduce spam. Learn how your comment data is processed.