在ember-cli中导入依赖项(例如,import math.js)

JBT*_*JBT 10 javascript amd ember.js mathjs ember-cli

我对在ember-cli中导入依赖关系感到困惑,尤其是关于标准AMD案例,正如官方Ember Cli文档中所提到的那样.该文档没有提供太多的例子,在我看来,它假设读者对AMD有很好的了解,但对我来说并非如此.我的直接用例是import math.js. 不幸的是,math.js官方文档没有提供有关使用Ember Cli导入的示例.然后,我发现这篇文章有相对更清晰的例子,特别是下面的例子似乎非常相关.

app.import({
  development: 'vendor/lodash/dist/lodash.js',
  production:  'vendor/lodash/dist/lodash.min.js'
}, {
  'lodash': [
    'default'
  ]
}); 
Run Code Online (Sandbox Code Playgroud)

然后,我用math.js做了类似的事情,如下所示:

app.import({
  development: 'bower_components/mathjs/dist/math.js',
  production:  'bower_components/mathjs/dist/math.min.js'
}, {
  'mathjs': [
    'default'
  ]
});
Run Code Online (Sandbox Code Playgroud)

但是,它不起作用.当我尝试使用它时

import mathjs from 'mathjs'
Run Code Online (Sandbox Code Playgroud)

我收到了一个错误.最后,我使用了以下解决方案:

// Brocfile.js
app.import('bower_components/mathjs/dist/math.min.js');

// some controller.js
var math = window.math
Run Code Online (Sandbox Code Playgroud)

虽然上面的解决方案有效,但我不喜欢它,因为它可能会受到名称冲突的影响.此外,基于math.js的文档,在我看来它应该支持标准的AMD类型的导入.

所以,我的问题如下.
1.在lodash上面的例子中,'default'意思是什么?这是对相应模块中导出的任何内容的一般参考吗?如何判断我是否可以使用它(例如,math.js)?
2.如果模块支持require.js,那么它是标准的AMD模块吗?如果是这样,给出如下代码:

require.config({
  paths: {
    mathjs: 'path/to/mathjs',
  }
});
require(['mathjs'], function (math) {
  // use math.js
  math.sqrt(-4); // 2i
});
Run Code Online (Sandbox Code Playgroud)

我怎样才能将它映射到Ember Cli代码?

jmu*_*yau 13

这有点痛苦,但由于mathjs不公开/支持命名的AMD模块,因此您无法使用额外的语法app.import.

您有两种选择:

  1. ember-browserify(如果库支持CommonJS - mathjs会做什么)
  2. 自己"填补"依赖图书馆

1. ember-browserify

  1. 安装ember-browserify

    ember install ember-browserify

  2. 将CommonJS库安装为NPM包

    npm install --save-dev mathjs

  3. 使用具有常规import语法的NPM包

    import mathjs from 'npm:mathjs';

2.垫片

您需要做的是"填充"库以使其通过import语句可用.我还是不知道垫片的意思是什么<:

如果您对创建凉亭包有兴趣,例如ember-cli-mathjs-shim您可以使用它并让其他人也能够使用它.一些例子是:

ember-cli-shims

ember-cli-moment-shim

ember-cli-sockjs-shim

但是,如果您不喜欢这样做,我建议您将以下内容添加到您的项目中:

vendor/shims/math.js- 在下面创建一个shims文件夹vendor(供应商是你的依赖性不是来自NPM或Bower的地方 - 并且Brocfile似乎不能app.import从这里以外的任何地方 - 例如app/shimsshims根级别的简单不起作用)

vendor/shims/math.js

(function() {
  /* globals define, math */

  function mathJSModule() {
    'use strict';

    return { 'default': math };
  }

  define('mathjs', [], mathJSModule);

})();
Run Code Online (Sandbox Code Playgroud)

Brocfile.js

app.import('bower_components/mathjs/dist/math.js');
app.import('vendor/shims/math.js', {
  exports: {
    'mathjs': [ 'default' ]
  }
});
Run Code Online (Sandbox Code Playgroud)

这里的顺序很重要.