2

我正在尝试使用Ember AppKit、grunt 和 compass 设置我的第一个 Ember.js 应用程序。appkit 通过grunt-contrib-compass提供了开箱即用的 compass 支持，但我终其一生都无法弄清楚如何安装 Zurb-Foundation，或者至少不能“正确”安装。

据我所知，grunt-contrib-compass 没有提供 compass 安装方法的包装器。我可以为 compass 配置文件复制compass.js 任务设置，但似乎应该有一种方法可以在不复制数据的情况下做到这一点。

或者，我想我可以手动复制所有内容，但这会切断我轻松升级的路径。

任何帮助将不胜感激。

4

1 回答 1

4

这就是我为我的 ember-app-kit 项目添加基础的方式。

鲍尔.json

{
  "name": "ember-app-kit",
  "dependencies": {
    "ember": "http://builds.emberjs.com.s3.amazonaws.com",
    "handlebars": "1.0.0",
    "jquery": "~1.9.1",
    "qunit": "~1.12.0",
    "foundation": "~4.3.2",
    "momentjs": "~2.1",
  }
}

bower install

sass 任务如下所示：

module.exports = {
  compile: {
    files: {
      'tmp/public/assets/app.css': 'app/styles/app.scss'
    }
  }
};

我只编译一个文件。

app.scss 文件：

@import "foundation_config";
@import "foundation_includes";
@import "mixins/index";
@import "fonts/index";
... truncated for brevity

_foundation_config.scss 文件是基础变量

_foundation_includes.scss 文件是我包含我正在使用的模块的地方。

@import "../../vendor/foundation/scss/normalize";
@import "../../vendor/foundation/scss/foundation/components/global";
@import "../../vendor/foundation/scss/foundation/components/grid";
@import "../../vendor/foundation/scss/foundation/components/visibility";
@import "../../vendor/foundation/scss/foundation/components/block-grid";
@import "../../vendor/foundation/scss/foundation/components/type";
@import "../../vendor/foundation/scss/foundation/components/buttons";
@import "../../vendor/foundation/scss/foundation/components/forms";
@import "../../vendor/foundation/scss/foundation/components/custom-forms";
// @import "../../vendor/foundation/scss/foundation/components/button-groups";
// @import "../../vendor/foundation/scss/foundation/components/dropdown-buttons";
// @import "../../vendor/foundation/scss/foundation/components/split-buttons";
// @import "../../vendor/foundation/scss/foundation/components/flex-video";
@import "../../vendor/foundation/scss/foundation/components/section";
@import "../../vendor/foundation/scss/foundation/components/top-bar";
... truncated for brevity

我希望这是有帮助的。

干杯戴夫

于 2013-09-18T20:52:07.807 回答