我以为我照着指示走了,但也许我漏掉了什么?
Gemfile:
gem 'foundation-rails'
运行bundle
运行rails g foundation:install
这将添加并更改以下内容:
视图/布局/应用程序.html.erb
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%= content_for?(:title) ? yield(:title) : "foundation-rails" %></title>
<%= stylesheet_link_tag "application" %>
<%= javascript_include_tag "vendor/modernizr" %>
<%= javascript_include_tag "application", 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<%= yield %>
</body>
</html>assets/stylesheets/application.css
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
* compiled file so the styles you add here take precedence over styles defined in any styles
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
* file per style scope.
*
*= require_tree .
*= require_self
*= require foundation_and_overrides
*/assets/stylesheets/foundation_and_overrides.scss
// -- snip --
// - - - - - - - - - - - - - - - - - - - - - - - - -
// $include-html-visibility-classes: $include-html-classes;
// $include-accessibility-classes: true;
// $include-table-visibility-classes: true;
// $include-legacy-visibility-classes: true;
@import 'foundation';assets/javascripts/application.js
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require foundation
//= require turbolinks
//= require_tree .
$(function(){ $(document).foundation(); });我已经成功地看到按钮正确显示,但其他东西只是拒绝按预期显示。我看的第一件事是网格示例,所以我复制并粘贴了源代码,但它没有像示例那样着色。间距似乎是正确的..。
然后我尝试了手风琴。我复制并粘贴了示例的源代码。它显示了列表项目符号,但没有展开/收缩。
然后我试了试最上面的吧台。我复制并粘贴了示例的源代码。它在顶部放置了一个水平条,但菜单项不是内联的。
然后我试着做一个全新的rails项目来测试foundation。我遵循了同样的步骤,得到了同样的结果。(含糊地说了些关于精神错乱的话...)
我以前用过foundation,但显然我遗漏了一些重要的东西。
$ rvm list
rvm rubies
=* ruby-2.2.1 [ x86_64 ]
# => - current
# =* - current && default
# * - default
$ rails -v
Rails 4.2.4发布于 2015-12-09 07:53:33
foundation-rails gem当前加载了foundation 5,而网站上有foundation 6的示例。它们似乎不兼容;)
要进行测试,请参阅documentation for foundation 5
https://stackoverflow.com/questions/34108795
复制相似问题