添加节点模块以嵌入CLI应用程序

Question

我想在我的Ember-CLI应用程序中使用这个Node.js模块https://www.npmjs.com/package/remarkable-regexp.

如何将其提供给Ember应用程序？

我通过添加它来尝试它 Brocfile.js

app.import('node_modules/remarkable-regexp/index.js');

但它失败了:

路径或模式"node_modules/remarkable-regexp/index.js"与任何文件都不匹配

Answer 1

由于remarkable-regexp是一个npm模块,我相信将它与ember-cli集成的最佳方法是使用ember-browserify.

在您的ember-cli应用程序中,您可以通过运行来安装插件 npm install --save-dev ember-browserify

因此,您可以使用ES6导入导入模块,方法是使用前缀 npm:

import Remarkable from 'npm:remarkable';
import Plugin from 'npm:remarkable-regexp';

var plugin = Plugin(
  // regexp to match
  /@(\w+)/,

  // this function will be called when something matches
  function(match, utils) {
    var url = 'http://example.org/u/' + match[1]

    return '<a href="' + utils.escape(url) + '">'
      + utils.escape(match[1])
      + '</a>'
  }
)

new Remarkable()
  .use(plugin)
  .render("hello @user")

// prints out:
// <p>hello <a href="http://example.org/u/user">user</a></p>

Answer 2

ember-browserify是在应用程序中使用的绝佳选择,并且正在努力尝试允许Ember CLI导入NPM包而无需任何额外帮助.

但是,如果您尝试在插件和应用程序中进行此操作,则可以采用稍微不同的方法,即手动修改broccoli构建链以包含Node包.

这是一个如何在插件index.js文件中完成此操作的快速示例:

var path = require('path');
var mergeTrees = require('broccoli-merge-trees');
var Funnel = require('broccoli-funnel');

module.exports = {
  name: 'my-addon',

  treeForVendor: function(tree) {
    var packagePath = path.dirname(require.resolve('node-package'));
    var packageTree = new Funnel(this.treeGenerator(packagePath), {
      srcDir: '/',
      destDir: 'node-package'
    });
    return mergeTrees([tree, packageTree]);
  },

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

    if (app.import) {
      this.importDependencies(app);
    }
  },

  importDependencies: function(app) {
    app.import('vendor/node-package/index.js');
  }
};

类似的技术可用于标准应用程序.同样,当Ember CLI团队添加对Node模块的支持时,此方法将很快被替换,因此请尽量使用它并与Ember CLI保持同步!

Answer 3

从Ember-CLI 2.15.0开始,您现在可以直接导入节点模块.要演示,请确保您的应用程序在Ember-CLI 2.15.0上,然后尝试安装Moment.js:

1. yarn add moment
2. 添加app.import('node_modules/moment/moment.js')到您的ember-cli-build.js文件中.
3. 您现在可以通过window对象访问时刻:window.moment.
4. (可选)如果您希望能够import moment from 'moment',则可以生成供应商垫片.请参阅此链接了解详情.

这不适用于不提供单个JavaScript包的节点模块(您需要使用其他注释中描述的方法进行捆绑),但这已经是一个巨大的改进.