在 Ember 插件中包含凉亭组件

Question

您需要如何在 Ember 插件中工作，以便在安装插件时包含 bower 包。

1) 我使用 bower instal packagename --save 安装了要包含在插件中的 bower 包

2) 然后在我的插件中，在根目录中，编辑 index.js，如下所示：

/* jshint node: true */
'use strict';

module.exports = {
  name: 'my-ember-component',
  included: function(app) {
    this._super.included(app);

    if(app.import){
      app.import(app.bowerDirectory + '/path-to-package/package.js');
    }
  }
};

但是，当我尝试启动安装了插件的应用程序时，我得到一个 ENOENT: no such file or directory, stat '/my-ember-application/tmp/source_map_concat-input_base_path-bWTPoVC9.tmp/0/bower_components/path-to-package/package.js

我想避免必须手动将 bower 依赖项添加到我安装插件的每个应用程序中。

注意：我正在使用npm link 来调试我的插件，也许这可能是问题的根源？

Answer 1

插件的凉亭组件通常会在ember install addon 期间添加到消费项目中。

但是由于您正在进行本地开发并使用 npm 链接。你需要模拟这个。你可以这样做：

ember generate your-addon-name

---

解释。

在 ember cli 文档中查看default blueprints 上的文档。

与插件同名的蓝图（除非明确说明 更改，见上文）将在安装后自动运行（在 开发，必须在链接后手动运行）。这是你的地方 可以将插件的凉亭依赖项绑定到客户端应用程序中，以便 它们实际上已安装。

简而言之，您需要为您的应用创建一个默认蓝图并在其中添加 bower 依赖项。

创建您的文件：

//blueprints/your-addon-name/index.js
module.exports = {
  normalizeEntityName: function() {}, // no-op since we're just adding dependencies

  afterInstall: function() {
    return this.addBowerPackageToProject('BOWER PACKAGE NAME'); // is a promise
  }
};

然后当你用

运行默认蓝图

ember generate your-addon-name