如何在 Rails 项目中使用 Zurb Foundation 3？答案

【问题标题】：How to use Zurb Foundation 3 in a Rails project?如何在 Rails 项目中使用 Zurb Foundation 3？
【发布时间】：2012-09-04 07:27:26
【问题描述】：

我开始学习 Rails 并创建了一个新的 3.2.8 项目，我想在其中包含 Zurb Foundation 框架，并希望尽可能轻松地更新（补丁和新“功能”）框架向前发展- 我猜，最好现在使用“gem install xx”，然后再继续使用“gem update”。

偶然发现https://github.com/zurb/foundation-rails（用于 Foundation 2），其中指出“当前的 zurb-foundation gem 现在托管在：https://github.com/zurb/foundation” - 但我似乎找不到 Foundation 3 的 gem那里。

对不起，如果这是一个新手问题，但我想我们都必须从某个地方开始 :-)

有人可以帮忙吗？

【问题讨论】：

标签： ruby-on-rails-3.2 zurb-foundation

【解决方案1】：

您可以在此处找到 Rails 3 的 Zurb Foundation 安装指南： http://foundation.zurb.com/docs/rails.html

【讨论】：

这应该是正确答案，另一个现在是404错误。

【解决方案2】：

http://foundation.zurb.com/docs/rails.html

通常我不会这样做，但由于这在 404 的历史中不断消失，我将在此处粘贴一些。这是 Foundation 4（2013 年 3 月 1 日）的最新版本：

宝石文件

group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'
  gem 'uglifier', '>= 1.0.3'
  # Add Foundation Here
  gem 'zurb-foundation', '~> 4.0.0'
end

然后

$bundle install

轻松安装：

rails g foundation:install

手动安装：

app/assets/stylesheets/application.scss

@import "foundation";

app/assets/javascripts/application.js

//= require foundation

my_layout.html.erb

<head>
    <!--Add to your head inside your page layout-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>

【讨论】：