将 WrapBootstrap 主题添加到 Ember (2.0)答案

【问题标题】：Adding WrapBootstrap Theme to Ember (2.0)将 WrapBootstrap 主题添加到 Ember (2.0)
【发布时间】：2015-10-28 11:36:06
【问题描述】：

我已经安装了 ember-cli-less 并包含了

@import "../../bower_components/bootstrap/less/bootstrap"

在我的样式/app.less 文件中

我在 ember-cli-build.js 文件中有以下内容：

app.import('bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.eot', {
    destDir: 'fonts'
  });
  app.import('bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf', {
    destDir: 'fonts'
  });
  app.import('bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.svg', {
    destDir: 'fonts'
  });
  app.import('bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff', {
    destDir: 'fonts'
  });
  app.import('bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2', {
    destDir: 'fonts'
  });

  app.import('bower_components/bootstrap/dist/js/bootstrap.js');

  return app.toTree();

现在我想从 Wrapbootstrap 中获取一个主题并将其包含在我的项目中。

还有另一个指向类似问题的链接：Recommended way to include bootstrap library in Ember.JS ember-cli App 但是 - 它似乎主要集中在设置引导程序上 - 添加主题并没有太大作用。

【问题讨论】：

标签： ember.js ember-cli

【解决方案1】：

据我所知（我在这里可能错了），因为您在 app/style.css 中包含引导程序，最终会出现在您的“app.css”文件中（而不是 vendor.css 文件）。

在这种情况下，我认为您还必须从 app/styles.less 导入主题。

@import "../../bower_components/bootstrap/less/bootstrap"
@import "path/to/wrap-boostrap/theme/main.css|.less file"

我假设您可以在 less 中为 css 文件保留扩展名，这只是为了指出您想要主题的 css/less 文件的路径。

要记住的一件事是 vendor.css 放在 app.css 之前（在 html 页面中），这意味着任何其他依赖 bootstrap.css 可用的插件都将无法工作，如果你这样做 app.import('path/to/jquery/plugin.css) 你会也必须将它们包含在您的 app.less 文件中。

【讨论】：