2011年8月27日 星期六

- Step by Step - Illustrated Tutorial: How to Install CoffeeScript in Windows

Step 1

Download duncansmart's CoffeeScript compiler for Windows on github.

Go to the project URL: https://github.com/duncansmart/coffeescript-windows and click on the Download button.

Step 2

Unzip the downloaded files.

Select these three files in the unzipped folder, and press Ctrl - C to copy them.

Step 3

Create a bin folder in your user folder.

The default user folder in Windows is located somewhere like C:\Users\ETBlue. For me, I would like to put my files in D drive, so I create a D:\ETBlue\bin\ folder.

Step 4

Press Ctrl - v to paste those three files into your bin folder.


Step 5

Go to Windows Control PanelSystem PropertiesAdvanced System Settings.

Select Advanced tab and click on Environment Variables... button.

Step 6

Select Path row in user variables, then click on Edit... button.


Step 7

In Variable value: field, add the bin path into it, and put a ; at the beginning of the path.

In my situation, I just typed ;D:\ETBlue\bin\. Then click ok, and ok, and ok.

Step 8

Log out of Windows and log in again.

Now the "coffee" command works in Windows command prompt.

Step 9

Write a cup of coffee.

Here is a simple demo file written by Geoffrey Grosenbach, the boss of Peep Code, who tutored me all these cool stuff. :-D

Step 10

Save the "demo.coffee" file anywhere you want.

In this case, I saved the .coffee file in D:\ETBlue\

Step 11

Open Command Prompt.

It should be at StartAll ProgramsAccessoriesCommand Prompt.

Step 12

In Command prompt, move current location to the folder containing the demo.coffee file.

The default location in Windows command prompt is "C:\Users\ETBlue."  Type d: and press enter, going to D drive, then type cd ETBlue and press enter, going to "D:\ETBlue."

Step 13 (Final step)

Use coffee command to compile ".coffee" file into ".js" file.

Type coffee demo.coffee > demo.js and press enter.

Result:

There will be a "demo.js" in the same folder where "demo.coffee" is.

"demo.js" looks like this:

So this is the magic of coffeescript:

Hooray! Now I can use Coffeescript in my ThinkPad X220 Tablet with Windows 7 operating system. Thanks to Geoffrey Grosenbach, @wildcrt, @hSATAC, @tkalu, and many good guys from Sass & Compass Meetup in Taiwan held by Handlino .

Please let me know if there is anything wrong in this post! :-D