中间人凉亭和苏西答案

【问题标题】：Middleman bower and Susy中间人凉亭和苏西
【发布时间】：2014-06-25 11:10:04
【问题描述】：

我正在使用带 bower 的中间人 3.3.3 来安装一些 js/css 包。我可以让我的 scss 工作，但中间人找不到 susy 框架在哪里。（在 bower_components 内）。我也在使用中间人链轮。

所以我的 config.rb 是这样的：

activate :sprockets

###
# Page options, layouts, aliases and proxies
###

# Per-page layout changes:
#
# With no layout
# page "/path/to/file.html", layout: false
#
# With alternative layout
# page "/path/to/file.html", layout: :otherlayout
#
# A path which all have the same layout
# with_layout :admin do
#   page "/admin/*"
# end

# Proxy pages (http://middlemanapp.com/basics/dynamic-pages/)
# proxy "/this-page-has-no-template.html", "/template-file.html", locals: {
#  which_fake_page: "Rendering a fake page with a local variable" }

###
# Helpers
###

# Automatic image dimensions on image_tag helper
# activate :automatic_image_sizes

# Reload the browser automatically whenever files change
# activate :livereload

# Methods defined in the helpers block are available in templates
# helpers do
#   def some_helper
#     "Helping"
#   end
# end


ready do
  sprockets.append_path File.join root, 'bower_components'
end

set :css_dir, 'stylesheets'

set :js_dir, 'javascripts'

set :images_dir, 'images'

set :fonts_dir, 'fonts'


# Build-specific configuration
configure :build do
  # For example, change the Compass output style for deployment
  # activate :minify_css

  # Minify Javascript on build
  activate :minify_javascript

  # Enable cache buster
  # activate :asset_hash

  activate :gzip

  # Use relative URLs
  activate :relative_assets

  # Or use a different image path
  # set :http_prefix, "/Content/images/"
end

我的文件树是这样的：

我的项目 - bower_components - 苏西 - 萨斯 - 库 - 模板 -凉亭.json - ... - 配置 - 脚本 - 来源 - 样式表 - 所有.css - _setting.scss - ... -凉亭.json - 配置.rb - ....

all.css

/*
 * This file is the same as rails' application.scss
 */

//= require "_settings"

_settings.scss

// Add all required scss files/folders
@import "susy";

我得到的错误告诉我它继续在源/样式表中搜索“susy”。任何整数？

【问题讨论】：

标签： bower middleman susy-sass

【解决方案1】：

Sprockets 支持 Bower，所以你可以直接添加你的 Bower 组件路径：
sprockets.append_path File.join root, 'bower_components'

http://middlemanapp.com/basics/asset-pipeline/#sprockets-import-path

【讨论】：

tnk 的答案，但正如您从我的代码中看到的那样，我已经尝试使用此解决方案但它不起作用。现在我正在使用 Grunt 但仍然...

【解决方案2】：

在config.rb

我已经添加了

sass_dir = 'source/stylesheets', 'bower_components'

after_configuration do
    @bower_config = JSON.parse(IO.read("#{root}/.bowerrc"))
    sprockets.append_path File.join "#{root}", @bower_config["directory"]
end

在mymain.scss

@import "bourbon";
@import "susy/sass/susy";
@import "normalize.scss/normalize";

他们都来自凉亭

【讨论】：