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是在应用程序中使用的绝佳选择，有work being done尝试允许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开始，您现在可以import node modules directly。要演示，请确保您的应用程序在Ember-CLI 2.15.0上，然后尝试安装Moment.js：

yarn add moment
将app.import('node_modules/moment/moment.js')添加到您的ember-cli-build.js文件中。
您现在可以通过window对象访问时刻：window.moment。
（可选）如果您希望能够import moment from 'moment'，则可以生成供应商垫片。有关详细信息，请参阅this link。

对于不提供单个JavaScript捆绑包的节点模块（您需要使用其他注释中描述的方法进行捆绑），这不会起作用，但它已经是一个巨大的改进。

Answer 4

浏览器化噪音可能是首选方法，但我通过在供应商文件夹中创建一个符号链接来解决它：

$ npm install --save-dev css.escape
$ cd vendor
$ ln -s ../node_modules/css.escape/css.escape.js css.escape.js

然后

// ember-cli-build.js
app.import('vendor/css.escape.js');

Answer 5

将你的ember-cli更新为v2.15.0-beta.1。新版本允许您将app.import与node_modules

一起使用

有关详细信息，请查看https://github.com/ember-cli/ember-cli/pull/7045

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

5 个答案: