addon中的成员-cli@0.2.0组件模板

Question

我想知道在addon项目中创建组件时应该使用什么约定.如果我在我的addon项目中使用成员-cli@0.2.0生成一个组件，蓝图将在addon/components中创建一个js文件，在addon/ template /components中创建一个模板，在app/components中创建一个js文件。我不太清楚的一部分是模板应该在哪里为这些组件。如果组件模板需要部分模板，则需要将部分模板放在app/ template目录中。如果它位于addon/templates目录中，则无法解析。因此，问题是:最好将所有模板(组件模板和部分模板)放在app/ template目录中，还是将组件模板保留在addon/ template /components目录中，将部件模板保留在app/template目录中？后者感觉有点杂乱无章，前者似乎更正确，只是因为蓝图的行为。有人有洞察力吗？

提前谢谢。

Answer 1

烬-cli正在进行大量开发，因此许多文件结构可能很快就会发生变化，但在这里，我们将对文件夹结构的当前状态以及如何安排文件夹结构进行一些深入的了解：

app/文件夹是直接导入应用程序的内容。帮助程序是从这里提取的，这就是为什么您必须为该文件夹中的每个组件创建一个文件。此外，模板将从这里的主要应用程序中提取出来，因此它们将以通常在ember (render、partial和标准分辨率)中可以访问的模板的方式访问。

有些人选择将他们的所有组件代码放在app/中，但这不是一个好主意，因为addon/文件夹的存在不仅是为了分离您的加载项代码，而且是使用ES6导入导入它的一种方式。因此，虽然不能直接访问addon/components/下的组件，但可以将它们导入应用程序，如下所示：

import SomeComponent from 'some-addon/components/some-component'

如果用户想要扩展一个addon以添加一些功能，这对他们非常有用。

addon中的模板在构建树中得到预编译，这使得插件更加健壮(例如，如果它们使用的是不同版本的htmlbar，那么它们仍然与基本应用程序兼容)。但是，它们不能通过解析器访问，所以您必须在addon的组件中手动导入它们，这就是为什么addon组件的蓝图如下所示：

import Ember from 'ember';
import layout from '../templates/components/some-component';

export default Ember.Component.extend({
  layout: layout
});

加载项的样式可以放在addon/styles/或app/styles/中。在addon/styles/中，它们也是预编译的，默认情况下包括在应用程序中。我强烈建议在app/styles中包括样式，因为这样可以在基本应用程序中使用预处理器导入来访问它们：

@import some-addon/main.css

这使得这些插件对于用户来说完全是可选的，而无需求助于app.import和config欺骗(这很好，因为嵌套的加载项_do不支持app.import。不要用它。)

注意:它们不是自动命名空间，所以您应该将样式放在文件夹中，以确保它们不与其他加载项样式冲突。

总结如下：

• 任何不需要由基本应用程序通过帮助程序、初始化器等直接访问的addon代码都应该驻留在addon/中。
• 您想要通过ES6导入访问的任何东西都应该驻留在addon/中
• 模板应该驻留在addon/templates/中并手动导入。
• 应该包含在标准Ember构建链中的组件存根、初始化器和其他文件应该驻留在app/中。
• 样式应该驻留在app/styles/中，并且应该在文件夹中使用名称空间(例如，app/styles/some-addon/)
• 不要使用app.import。