【问题标题】:How to import an amd module in ember-cli?如何在 ember-cli 中导入 amd 模块?
【发布时间】:2023-03-10 22:03:01
【问题描述】:

ember-cli 的大力帮助下,我正在构建一个 EmberJS 应用程序,这很好,但是我有一个错误,我找不到我做错了什么。

这是我在花椰菜文件中所做的:

app.import('vendor/underscore/underscore.js', {
    exports: {
        "underscore": [
            "underscore"
        ]
    }
});

然后在我的一个控制器中:

import _ from "underscore";

ember-cli 构建我的应用程序。

但是当我使用下划线转到控制器时,我得到了错误:

错误:找不到模块下划线。

我做错了什么?

【问题讨论】:

    标签: ember-cli


    【解决方案1】:

    在最近的 ember 版本中(我使用的是 2.11),可以使用

    在 UMD 包装器中加载 AMD
    app.import('bower_components/js-md5/js/md5.js', {using: [{ 
       transformation: 'amd', as: 'js-md5' 
    }]});
    

    在你的代码中

    import md5 from 'js-md5';
    

    在下划线的情况下,它应该如下所示:

    app.import('vendor/underscore/underscore.js', {using: [{ 
       transformation: 'amd', as: 'underscore' 
    }]});
    

    【讨论】:

      【解决方案2】:

      我从 #emberjs IRC 上的锁中得到了这个。

      https://github.com/ef4/ember-browserify

      在您的项目中:

      npm install --save-dev ember-browserify
      npm install --save-dev underscore
      

      在您的控制器中:

      import _ from "npm:underscore";
      

      然后你可以使用_。例如:_.each([1,2,3], alert);。我取出了我手动添加到 brocfile 和 package.json 的所有内容。显然这会为你做。疯了!

      【讨论】:

      • 这里的问题是 ember cli 推荐使用 bower 作为你的依赖管理器。我认为这是一个很好的方法,但它会分散您的依赖关系并使它们更难以遵循。目前,我已经接受使用 lodash/underscore 等库作为全局变量,方法是将它们导入 Brocfile 并使用 /* global _ */ 声明它们以安抚 jshint。
      【解决方案3】:

      试试:

      app.import({
        development: 'vendor/underscore/underscore.js',
        production:  'vendor/underscore/underscore.min.js'
      }, {
        'underscore': [
          'default'
        ]
      });
      

      这至少会给出“import _ from 'underscore';”一个工作的机会。如果您选择 AMD 或 ES6 版本的下划线/lodash,请使用“默认”列出您希望导入的模块。

      编辑:

      使用下划线很重要吗?为什么我要问,我在一个 Ember-cli 项目中使用 lodash,它运行良好。

      Console> bower install lodash --save
      

      然后在 Brocfile 中:

      app.import({
        development: 'vendor/lodash/dist/lodash.js',
        production:  'vendor/lodash/dist/lodash.min.js'
      }, {
        'lodash': [
          'default'
        ]
      });
      
      
      //or:
      app.import('vendor/lodash/dist/lodash.min.js');
      

      至于下划线 - an issue 没有捆绑 devDependencies,其中下划线是其中之一。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2015-06-10
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2017-06-13
        • 2017-04-24
        • 1970-01-01
        相关资源
        最近更新 更多