如何在 ember-cli 插件组件中找到 npm 模块

Posted 2023-02-19

【中文标题】如何在 ember-cli 插件组件中找到 npm 模块

【英文标题】：How to find npm module inside ember-cli addon component

【发布时间】：2015-10-17 02:36:29

【问题描述】：

我使用 ember-browserify 在我的 ember-cli 应用程序中查找 npm 模块，但由于某种原因，它不适用于 ember-cli 插件。

所以我的问题是：还有其他方法可以将 npm 模块导入到 ember-cli 插件中吗？

编辑：

所以我无法导入npm模块，但是我发现我要导入的具体模块也是一个bower组件，所以我就这样安装它并通过index.js导入它像这样：

included: function(app) 
  this._super.included(app);

  app.import('bower_components/dropzone/dist/dropzone.js');

这很奏效。用node_modules 这样做是不可能的。很难将 npm 模块导入 ember-cli 插件。

【参考方案1】：

ember-fetch 执行此操作。代码有点复杂：

treeForVendor: function(tree) 

  // Get the path of whatwg-fetch in node modules
  var fetchPath = require.resolve('whatwg-fetch');

  // use utility function to expand it into a pattern
  var expandedFetchPath = expand(fetchPath);

  // rename all the files in a tree containing files matching the pattern
  var fetch = rename(find(expandedFetchPath), function(path) 
    return 'whatwg-fetch/fetch.js'
  );

  // apply a template to each file in the tree and merge the trees
  return mergeTrees([
    new Template(fetch, templatePath, function variables(content) 
      return 
        moduleBody: content
      ;
    )
  ]);
,

included: function(app) 
  this.app = app;
  this._super.included(app);

  // import the tree created above in treeForVendor
  app.import('vendor/whatwg-fetch/fetch.js', 
    exports: 
      default: [
        'default',
        'Headers',
        'Request',
        'Response'
      ]
    
  );

取自https://github.com/stefanpenner/ember-fetch/blob/master/index.js

希望这会有所帮助。

【讨论】：

我没有关注...你能解释得更好吗？

就像我说的，代码有点复杂。我会添加一些 cmets 供您学习，但需要一些工作才能适应。

所以我基本上安装了ember-fetch并导入了node模块？还是我必须安装它，然后将此代码添加到我的插件的 index.js 中？

【参考方案2】：

在插件中，将导入添加到对象的app/ 版本（这通常只是导出对象）。

在使用插件的应用中，安装 ember-browserify 和 npm 模块。

例如，在插件中的app/models/user.js：

import TimezoneDetect from 'npm:jstimezonedetect';

export  default  from 'common/models/user';

看 https://github.com/ef4/ember-browserify#using-ember-browserify-in-addons