如何在 app.css 中为 ember js 插件添加 css 样式答案

【问题标题】：How to add css styles in app.css for ember js addon如何在 app.css 中为 ember js 插件添加 css 样式
【发布时间】：2015-07-13 15:12:44
【问题描述】：

我正在创建 ember 插件，这个插件需要的 CSS 样式很少！

如何添加它们，以便当消费应用程序使用此插件时，特定的 css 样式会直接添加到消费应用程序的 app.css 文件中？

例如：插件：下拉插件需要样式

.active-menu {
    background-color: #4183C4;
}

消费应用：在线表格

当在线表单使用下拉插件时，我希望 .active-menu 自动添加到 app.css！

【问题讨论】：

在插件目录中，创建一个样式文件夹。在其中，使用插件的样式创建一个 css 文件。它们应该自动包含在消费应用的 css 中。我就是这样为我的插件做的。 github.com/blessenm/ember-cli-bm-select/blob/master/addon/…
你确定吗？我已经尝试过了，但它没有用！我也用虚拟测试应用程序尝试过！它是否意味着仅适用于消费应用程序而不是测试虚拟应用程序？
好吧，我尝试在一个新应用上安装我的插件，插件 css 被附加到 vendor.css 文件中。我不确定虚拟应用程序。我需要使用最新版本的 ember 和 cli 进行全面检查。
对，让我也检查一下，然后回来！

【解决方案1】：

module.exports = {

  //...
  //...

  included: function(app) {
    app.import('vendor/style.css');
  }

  //...
  //...

}

注意：css代码将添加到dist/assets/vendor.css

【讨论】：

hmmm 所以这里的关键是“包含”钩对！我在找这个钩子。让我确认一下，然后再回来。
这绝对有效。如果你想匹配 Ember 应用的代码结构，你也可以从你的 app/styles 目录中导入 css。无论哪种方式，它都会包含在您的 Ember 应用程序的 vendor.css 文件中。