使用Bower的scss文件中的scss依赖关系

Question

我正在为自己的项目开发类似于引导程序的scss框架。

该项目是注册的凉亭包。 在我的scss文件中，我依赖于另一个Bower软件包，我需要@import在其他scss文件中。

似乎仅在bower.json文件中声明依赖项是不够的。

从其他Bower软件包中包含相关的scss文件的正确方法是什么？

这是我的bower.json文件：

{
  "name": "pre-cortex",
  "version": "0.0.5",
  "authors": [
    "Ole Henrik Skogstrøm"
  ],
  "description": "a scss framework",
  "main": "pre-cortex.scss",
  "keywords": [
    "pre-cortex",
    "cortex"
  ],
  "license": "MIT",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "compass-breakpoint": "~2.5.0"
  }
}

这是我的主文件：

// This first line is not correct. This does not work when the package is installed in other projects. 
@import "bower_components/compass-breakpoint/stylesheets/breakpoint";

@import "components/css-reset";
@import "components/form-reset-helpers";
@import "components/variables";
@import "components/typografi";
@import "components/grid";
@import "components/helpers";
@import "components/nav-horizontal";
@import "components/nav-vertical";
@import "components/jumbotron";
@import "components/well";
@import "components/form";
@import "components/button";

Answer 1

我基于@BassJobsen评论找到了解决方案。

在试图包含到项目中的Bower软件包中，使用常规的@import路径。 例如：

@import "../compass-breakpoint/stylesheets/breakpoint";

问题是我正在使用bower link来引用我的软件包的开发版本（ 在此处了解有关bower link更多信息）。 通常，这是正确的路径。

与凉亭链接。 这导致在包含@import'../etc/etc'时路径错误。 因为包只是符号链接进来的。

为了解决这个问题，只需向编译器添加一个额外的加载路径。 我使用的是gulp，所以对我来说，我将此行添加到了styles.js文件中： loadPath: ["bower_components/angular"]

例：

var sassOptions = {
  style: 'expanded',
  loadPath: ["bower_components/angular"]
};

结果是现在其中一个加载路径为：

bower_components/angular/../compass-breakpoint/stylesheets/breakpoint

对于链接的Bower程序包和常规安装的程序包，这都非常有效。 :)