Question

我想知道在插件项目中创建组件时使用的约定是什么...如果我使用ember-cli@0.2.0在我的插件项目中生成组件，蓝图将创建一个js addon / components中的文件，addon / templates / components中的模板以及app / components中的js文件。我不清楚的部分是模板应该存在于这些组件的位置。如果我的组件模板需要部分模板，我需要将部分模板放在app / templates目录中。如果它位于addon / templates目录中，则无法解析。所以问题是：最好将所有模板（组件模板和部分模板）放在app / templates目录中，或者将组件模板保留在addon / templates / components目录中，将部分模板保留在app / templates目录中？后者感觉有点混乱，前者似乎更正确，只是因为蓝图的行为。有人有任何见解吗？

提前致谢。

Answer 1

Ember-cli正在大力发展，所以很多文件结构很快就会改变，但是这里有一些关于文件夹结构当前状态的见解以及为什么它按照它的方式排列：

app/文件夹直接导入您的应用程序。从这里拉出助手，这就是为什么你必须为这个文件夹中的每个组件都有一个文件。此外，模板将从主应用程序中提取，因此可以通过ember应用程序（render，partial和标准分辨率）正常访问模板的方式访问它们。

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

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

如果他们想扩展插件以添加某些功能，这对插件使用者非常有用。

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

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不支持{{1}不要使用它。）

注意：它们不会自动命名，因此您应该将样式放在一个文件夹中，以确保它们与其他插件样式不冲突。

总结：

基本应用程序无需通过帮助程序，初始化程序等直接访问的任何插件代码。应该住在app.import
您希望ES6导入可访问的任何内容都应该位于addon/
模板应位于addon/并手动导入
应包含在标准Ember构建链中的组件存根，初始值设定项和其他文件应存在于addon/templates/
样式应该位于app/，并且应该在文件夹中命名（例如app/styles/）
请勿使用app/styles/some-addon/。

ember-cli@0.2.0插件中的组件模板

1 个答案: