ember 3rd 方组件：链接还是其他？答案

【问题标题】：ember 3rd party component: link or something else?ember 3rd 方组件：链接还是其他？
【发布时间】：2014-03-12 20:30:29
【问题描述】：

我想在我的 ember 应用中使用 ember-table。我刚刚通过凉亭安装了它。但是，ember 似乎要求各个部分（例如模板等）位于特定目录中。

我应该只是 ln -s 这些，还是有什么方法可以告诉 ember 在 bower_components/ember-table 中搜索？

更新：

通过类比 ember-table 示例应用程序，这个块似乎主要给了我我需要的东西：

// ember-table w/ requirements
require('bower_components/bootstrap/js/bootstrap.min');
require('bower_components/jquery-mousewheel/jquery.mousewheel.js');
require('bower_components/antiscroll/antiscroll');
require('bower_components/datejs/build/date.js');
require('bower_components/ember-addpar-mixins/resize_handler');
require('bower_components/ember-addepar-mixins/style_bindings');
require('bower_components/ember-table/dist/ember-table');

事实证明，ember-table 将模板注入到 ember 中，因此它们不需要在模板/组件中。（NB ember 组件指南可能想讨论如何做到这一点......）

到目前为止，对我来说更多的问题是将引导程序与 ember-table 分开。（子问题：1）有没有办法将 less 转换为 scss，因为 ember-table 是基于较少的？是否有使用 css 命名空间的 bootstrap 版本不会进行全局更改？）

【问题讨论】：

我建议使用像 grunt 这样的构建工具来完全避免所有这些类型的问题。我假设您正在使用 bower.json 和某种构建工具？ yeoman.io
我正在使用 grunt... 是否有安装/配置 ember 组件的 grunt 任务？（我是一个 grunt 相对新手：从来没有写过 grunt 任务。）
如果您安装了 yeoman 套件（之前评论中的链接），那么只需创建一个空文件夹，cd 到它并尝试 yo ember。您将获得一个已经为构建设置的脚手架模板项目，包括缩小、测试、凉亭组件等。将您的应用程序移至该脚手架，或从中窃取想法以合并到您自己的中。
其实有个项目是用yeoman-ember搭建的。但是我的问题是让 ember 识别 ember 组件文件的路径。你的建议对我有什么帮助？（请参阅指南：emberjs.com/guides/components/defining-a-component -- 文件需要位于特定位置。这有什么繁重的任务吗？）
如果你使用generator-ember，你应该默认有grunt-neuter。这个包将允许您在主应用程序文件中使用require 将您的 js 文件包含并连接到单个文件中。签出：github.com/trek/grunt-neuter

标签： gruntjs bower grunt-usemin ember-table

【解决方案1】：

这个任务是grunt-usemin。 useminPrepare 任务扫描指定的 HTML 文件中的块，如下所示：

<!-- build:<type>(alternate search path) <path> -->
... HTML Markup, list of script / link tags.
<!-- endbuild -->

从那里，块中的文件将被连接和丑化，目标 HTML 中的引用将被更新以包含已处理的文件。你应该把你正常的<link> 和<script> 标签引用bower_components，一切都会在构建中解决。当grunt 作为服务器运行时，文件直接从它们的位置提供服务，无需连接和缩小。

【讨论】：

史蒂夫，你在传递有用的信息，但与我的需要无关。尽管我确实需要了解更多关于 grunt 的信息，但我要求的是 what 我需要具体包含哪些内容才能使第 3 方 ember 组件正常工作（尤其是 ember-table）——而不是如何包含它。事实上，通过从示例应用程序中稳步复制，我已经开始看到一些东西。我认为剩余的不兼容可能是因为我的 css 的其余部分（基于 compass/foundation）在某种程度上与引导程序发生冲突。
我在回应您的请求：“有没有办法告诉 ember 在 bower_components/ember-table 中搜索？”答案在上面。在 grunt-usemin 代码块中包含引用 ember-table 的 <script> 标记。不确定还有什么您在寻找...
如何分辨 ember 是我问题的关键部分。查看 ember-table 源代码，我看到如下内容：Ember.TEMPLATES["body-container"] = ... 实际上，这就是 ember 的说法，尽管组件指南中没有提到这些内容。我想我现在基本上已经解决了，直到我的项目不是基于引导程序的。我试图弄清楚如何在不影响其他样式的情况下封装 sass-bootstrap 的相关部分。如果您能告诉我该怎么做，我将不胜感激。
我明白了，很抱歉造成混乱。我认为这更像是一个ember-table 问题。我在您的问题中添加了标签，所以也许更熟悉它的人可以回答。我确实使用 sass-bootstrap，它通常可以很好地与我自己的样式结合使用。我确实对 glyphicon 字体有疑问 :(

【解决方案2】：

向史蒂夫道歉令人困惑的问题......请参阅：

https://github.com/Addepar/ember-table/issues/109

为了将来参考，事实上，即使一开始大多数事情都在工作，但它看起来不像，因为 css 不正确。（一方面，如果您想看到 ember 表执行其神奇的滚动技巧，则必须在适当的受限空间中呈现它们。）

arzibel 提到的示例 repo：https://github.com/FellowMD/ember-table-scroll-issue 我觉得很有帮助。

【讨论】：