2011/04/19
转自：http://heikezhi.com/2011/04/19/how-to-rails-3-1-coffeescript-howto/
Rails 3.1 CoffeeScript & SASS初体验
想必大家都已经看到了Rails 3.1将内置jQuery，CoffeeScript以及SaSS的消息，那么到底会是什么样呢？下面就让我们一起来抢先体验下吧！
首先，安装Edge Rails
git clone git://github.com/rails/rails.git
然后，创建一个新的3.1 APP
~/rails/bin/rails new yourapp --edge
生成一个scaffold：
rails generate scaffold Link title:string url:string slug:string visits:integer
rake db:migrate
现在启动rails server，然后通过浏览器打开http://localhost:3000/links/，看起来和往常没什么两样，让我们来看看源码，你会在HTML的头部看到：
- <link href="/assets/application.css" media="screen" rel="stylesheet" type="text/css">
- <script src="/assets/application.js" type="text/javascript"></script>
- <meta content="authenticity_token" name="csrf-param">
- <meta name="csrf-token" content="YNQeo1YRsjh4FtrRzpYFbiT8AzfFdfH0mqN9rkopEWg=">
注意里面的application.js和application.css，但是同往常不一样，你在public目录下不会找到这两个文件，它们去哪了呢？
打开app目录，你会发现里面多了一个assets目录，在这个assets目录下，你会看到眼熟的stylesheets目录和javascripts目录，没错，它们跑来了这里，打开application.css，你会看到里面只有一段注释而没有任何代码：
/*
* FIXME: Introduce SCSS & Sprockets
*= require_tree .
*/
其中require_tree的作用就是告诉系统将stylesheets目录下的所有文件和并成一个单独的文件，很酷，不是吗，这都要感谢Sprockets！
体验Sass
要体验sass，只要把scaffold.css改成scaffold.css.scss，然后刷新浏览器，不过你应该看不到任何变化，这是因为scss是css的超集，所以你可以在scss文件中继续使用css的语法而不会发生任何错误，scaffold.css的内容很无聊，这是rails默认生成的，让我们试着对它做些修改：
- $background_color: #fee;
- $text_color: #000;
- body { background-color: $background_color; color: $text_color; }
现在再去看看效果吧！
体验Coffeescript
在我写这篇帖子的时候，application.js有些问题，里面的一些注释没法正确解析，如果你遇到这个问题，把它改成下面这样：
#= require jquery
#= require jquery_ujs
#= require_tree .
这和application.css一样，require_tree会把javascripts目录下的所有文件合并成一个文件，现在我们可以创建一个awesome.js.coffee文件来体验coffeescript：
square = (x) -> x * x
alert square(10)
刷新http://localhost:3000/links/，你会得到一个烦人的js对话框，里面显示“100”。
好了，就是这样，如果你对coffeescript感兴趣，可以去它的官方网站了解更多信息。
