Scss/Sass 不能与 sinatra-assetpack 一起使用答案

【问题标题】：Scss/Sass not working with sinatra-assetpackScss/Sass 不能与 sinatra-assetpack 一起使用
【发布时间】：2013-11-22 06:03:17
【问题描述】：

我正在写一个classic style sinatra app，并试图用sinatra-assetpack 打包我的scss 文件，但它不起作用。

这是我的主要网页文件：

require 'rubygems'
require 'sinatra'
require 'haml'
require 'sass'
require 'compass'
require 'sinatra/assetpack'

set :root, File.dirname(__FILE__)
set :environment, ENV["RACK_ENV"] || "development"

configure do
  Compass.configuration do |config|
    config.project_path = File.dirname(__FILE__)
    config.sass_dir = 'views/stylesheets'
  end

  set :haml, { :format => :html5 }
  set :scss, Compass.sass_engine_options

  assets {
    serve '/javascripts', from: 'public/javascripts'
    serve '/stylesheets', from: '/stylesheets'

    # The second parameter defines where the compressed version will be served.
    # (Note: that parameter is optional, AssetPack will figure it out.)
    js :lib, '/javascripts/script.js', [
      '/javascripts/lib/modernizr-2.5.3.js',
      '/javascripts/lib/underscore-min.js',
      '/javascripts/lib/slides.min.jquery.js',
      '/javascripts/lib/jquery.scrollTo-1.4.2-min.js'
    ]

    css :app, '/stylesheets/screen.css', [
      '/stylesheets/screen.css',
      '/fonts/meta.css'
    ]

    js_compression  :jsmin
    css_compression :sass
  }
end

我在我的布局文件中使用了这个：

= css :app, :media => 'screen'

screen.scss 文件存储在/views/stylesheets/screen.scss 中，meta.css 存储在/public/fonts/meta.css 中。对screen.css 的引用不正确吗？是否应该从不同的目录提供它们？

我的主网络文件中也有这个

get '/stylesheets/screen.css' do
  content_type 'text/css', :charset => 'utf-8'
  scss :'stylesheets/screen'
end

放入或移除它并没有解决任何问题 - 这条路线有必要吗？

【问题讨论】：

好像是把 assets 块放在根范围内，但我还没试过……请看下文。示例目录中有示例代码。 github.com/rstacruz/sinatra-assetpack

标签： sinatra sass sinatra-assetpack

【解决方案1】：

你不应该再保留你的get '/stylesheets/screen.css' 路由了。

我还注意到您的 Gemfile / app 文件中有指南针。 Sinatra AssetPack 指出它与 compass 不兼容。您可以包含sinatra/support 以使用它，例如他们的示例应用程序here。

将您的 serve '/stylesheets', from: '/stylesheets' 语句更改为 serve '/stylesheets', from: '/views/stylesheets' 以反映您希望从何处提供 sass 文件。

毕竟，您应该能够像下面这样提供您的 javascript 和 scss：

= css :app, :media => 'screen'
= js :lib

【讨论】：