如何使Twitter Bootstrap的Less文件与Sinatra AssetPack一起使用?

本文介绍了如何使Twitter Bootstrap的Less文件与Sinatra AssetPack一起使用?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试使用 Sinatra AssetPack 来获取Bootstrap的Less文件，但是我得到了Less解析器错误.这些错误使我相信，通过bootstrap.less导入的文件越少，彼此之间就不会意识到.

I am trying to get Bootstrap's Less files working with Sinatra AssetPack, but I am getting Less parser errors. These errors lead me believe that the less files being imported through bootstrap.less are not aware of each other.

我有一个app.rb文件:

I have an app.rb file:

require 'sinatra/base'
require 'sinatra/assetpack'

class App < Sinatra::Base
  set :root, File.dirname(__FILE__)
  register Sinatra::AssetPack

  assets do
    css :bootstrap, [
      '/css/bootstrap.css'
    ]

  end

  get '/' do
    erb :index
  end

  # start the server if ruby file executed directly
  run! if app_file == $0
end

我已经将所有缺少Bootstrap的文件复制到/app/css目录中，并修改了bootstrap.less，以便每个@import语句以.css而不是.less结尾(尽管实际的文件扩展名没有更改).我还把所有内容都放在了Github上: https://github.com/elevine/sinatra-assetpack -bootstrap

I've copied all of the Bootstrap less files into the /app/css directory and modified bootstrap.less so that each @import statement ends in .css instead of .less (the actual file extensions weren't changed though). I've also put everything up on Github: https://github.com/elevine/sinatra-assetpack-bootstrap

这是我遇到的错误之一的堆栈跟踪的前半部分:

Here is first half of the stack trace from one of the errors I am getting:

  Less::ParseError - .tab-focus is undefined:
        at /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/js/lib/less/parser.js:385:31
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/parser.rb:57:in `block in to_css'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/java_script/v8_context.rb:90:in `block in do_lock'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/java_script/v8_context.rb:88:in `do_lock'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/java_script/v8_context.rb:60:in `lock'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/java_script/v8_context.rb:30:in `exec'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/java_script.rb:26:in `exec'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/less-2.2.1/lib/less/parser.rb:57:in `to_css'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/tilt-1.3.3/lib/tilt/css.rb:68:in `evaluate'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/tilt-1.3.3/lib/tilt/template.rb:76:in `render'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/sinatra-1.3.3/lib/sinatra/base.rb:686:in `render'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/sinatra-assetpack-0.0.11/lib/sinatra/assetpack/class_methods.rb:71:in `block (3 levels) in add_individual_routes!'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/tilt-1.3.3/lib/tilt.rb:127:in `fetch'
        /users/elevine/.rbenv/versions/1.9.2-p320/lib/ruby/gems/1.9.1/gems/sinatra-assetpack-0.0.11/lib/sinatra/assetpack/class_methods.rb:70:in `block (2 levels) in add_individual_routes!'

.tab-focus是在mixins.less中定义的，此错误源于reset.less，这是bootstrap.less中的首次导入.我尝试重新排列导入的顺序，但是并不能解决问题.

.tab-focus is defined in mixins.less, and this error originates from reset.less which is the first import in bootstrap.less. I've tried rearranging the order of the imports, but it did not solve the problem.

是否可以在bootstrap.less中获取@import语句以在此设置中正常工作?

Bootstrap的Less文件与Sinatra

如何使Twitter Bootstrap的Less文件与Sinatra AssetPack一起使用?

问题描述

推荐答案