资产管道未定义变量SASS

问题描述

我一直尝试使用和下载所有文件并复制到目录我在部分_bordered-pull上收到以下错误：

  ActionView :: Template :: Error（未定义的变量：$ fa-css-prefix。
  

并且我正在导入（或至少尝试）部分。

我的assets / stylesheets目录如下：

   -  application.css.scss 
 --bootstrap.css.scss 
 --font-awesome.css.scss.erb 
  - -stylish-portfolio.css.scss 
  -  | font-awesome 
 --_ bordered-pulling.css.scss 
 --...（其他部分）
  - font-awesome.css.scss 
  

Application.css.scss：

  / * 
这是一个将编译成application.css的清单文件，它将包括所有文件
 *下面。 
 * 
 *此目录中的任何CSS和SCSS文件，lib / assets / stylesheets，vendor / assets / stylesheets，
 *或插件的vendor / assets / stylesheets这里使用相对路径引用。 
 * 
 *您可以向此文件中添加应用程序范围的样式，它们将出现在
 *编译文件的顶部，但通常最好创建一个新文件每个样式范围。 
 * 
 * = require_self 
 * = require_tree。 
 * / 
 
 @import'font-awesome / font-awesome'; 
 @import'bootstrap'; 
 @import'font-awesome'; 
 @import'stylish-portfolio'; 
  

Font-awesome.css.scss

  / *！ 
 * Font Awesome 4.0.3 by @davegandy  -  http://fontawesome.io  -  @fontawesome 
 *许可证 -  http://fontawesome.io/license（字体：SIL OFL 1.1，CSS：MIT许可证）
 * / 
 
 @importvariables; 
 @importmixins; 
 @importpath; 
 @importcore; 
 @importlarger; 
 @importfixed-width; 
 @importlist; 
 @importbordered-pull; 
 @importspinning; 
 @importrotated-flipped; 
 @importstacked; 
 @importicons; 
  

_bordered-pulling.css.scss

  //边界& pulled 
 // ------------------------- 
 
。＃{$ fa-css-prefix} -border {
 padding：.2em .25em .15em; 
 border：solid .08em $ fa-border-color; 
 border-radius：.1em; 
} 
 
 .pull-right {float：right; } 
 .pull-left {float：left; } 
 
。＃{$ fa-css-prefix} {
& .pull-left {margin-right：.3em; } 
& .pull-right {margin-left：.3em; } 
} 
  

是语法错误还是我设置了我的资产管道错误？ / p>

_variable.css.scss

I've been trying to use http://startbootstrap.com/stylish-portfolio and after downloading all files and copying to the directory I'm getting the following error on the partial _bordered-pull:

ActionView::Template::Error (Undefined variable: "$fa-css-prefix".

However the variable is defined and I'm importing (or at least trying) the partial.

My assets/stylesheets directory is the following:

--application.css.scss
--bootstrap.css.scss
--font-awesome.css.scss.erb
--stylish-portfolio.css.scss
--|font-awesome
  --_bordered-pulled.css.scss
  --...(other partials)
  --font-awesome.css.scss

Application.css.scss:

/*
 * 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 vendor/assets/stylesheets of plugins, if any, 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 top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *
 *= require_self
 *= require_tree .
 */

@import 'font-awesome/font-awesome';
@import 'bootstrap';
@import 'font-awesome';
@import 'stylish-portfolio';

Font-awesome.css.scss

/*!
 *  Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */

@import "variables";
@import "mixins";
@import "path";
@import "core";
@import "larger";
@import "fixed-width";
@import "list";
@import "bordered-pulled";
@import "spinning";
@import "rotated-flipped";
@import "stacked";
@import "icons";

_bordered-pulled.css.scss

// Bordered & Pulled
// -------------------------

.#{$fa-css-prefix}-border {
  padding: .2em .25em .15em;
  border: solid .08em $fa-border-color;
  border-radius: .1em;
}

.pull-right { float: right; }
.pull-left { float: left; }

.#{$fa-css-prefix} {
  &.pull-left { margin-right: .3em; }
  &.pull-right { margin-left: .3em; }
}

Is it a syntax error or did I setup my asset pipeline wrong?

_variable.css.scsshttps://github.com/IronSummitMedia/startbootstrap/blob/master/templates/stylish-portfolio/font-awesome/scss/_variables.scss

解决方案

You have to do the following:

Source: fontawsome's documentation

http://fontawesome.io/get-started#custom-less

这篇关于资产管道未定义变量SASS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！