如何使用jspm / system.js正确加载本地AMD模块

杰布加尔

在使用es6,JSPM和system.js的Aurelia项目中,我很难使用本地AMD模块。我希望那里的人可以帮助我配置项目,以使我能够导入/加载我的AMD模块并在我的项目中使用它们。本地AMD样式模块的格式类似于以下格式:

define
(['require',
'lib/alerts/STARTSTOP',
'lib/alerts/STOPPED',
...
],
function( require, STARTSTOP, STOPPED, ... ) {
  return {
    alert: function( data ) {
      var type = data.type;
      var ev   = data.event;
      var cls  = require( 'lib/alerts/' + ev );
      return new cls( data );
    }
  };
});

当我尝试将此模块导入/加载到es6模块中时,遇到以下错误:Uncaught TypeError: Unexpected anonymous AMD define.尝试通过以下两种方式之一加载模块时收到此错误:

System.import('lib/alerts/AlertFactory').then( (m) => {
  console.log( m );
});

或者

import AlertFactory from 'lib/alerts/AlertFactory.js';

我还确保将以下脚本添加到我的index.html中:

<script>
    window.define = System.amdDefine;
    window.require = window.requirejs = System.amdRequire;
</script>

除了上述内容,我还向我的config.js文件中添加了meta格式属性,但这似乎也无济于事。

meta: {
    ...
    "lib/alerts/*.js": {
      "format": "amd"
    }
}

有人对我为什么会遇到我看到的错误以及如何正确加载模块有任何想法吗?感谢您提供的任何帮助/见解。

更新

我终于意识到,这里的主要问题是我试图在Aurelia项目中使用现有的AMD模块,并且默认的Aurelia gulp构建假定所有代码都是用ES6编写的,并且未与AMD混合。这就是为什么我遇到问题。Vanilla jspm / system.js可处理多种模块格式,但Aurelia并非开箱即用。

瓦利切克

只需将AMD模块取出来,src这样babel将无法移植它。这是我用来导入jquery模块的有效解决方案:

首先,我local_packages在项目根目录中文件夹,并且有jquery模块local_packages/somelib/js/mymodule.js

然后在 config.js

paths: {
  ...
  "local/*": "local_packages/*",
}

map: {
  ...
  "somelib": "local/somelib",
  "somelib1": "/local_packages/somelib1",
}

最后,我的导入看起来像: import 'somelib/js/mymodule';

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何使System.js从CDN加载全局格式的模块?

来自分类Dev

使用System.js在TypeScript中加载模块

来自分类Dev

如何使用JSPM导入带有Typescript声明的外部NPM模块

来自分类Dev

jspm不使用--inject加载捆绑软件

来自分类Dev

将MOUT.js模块与JSPM结合使用

来自分类Dev

如何正确使用System.import()?

来自分类Dev

如何从Dojo层加载AMD模块

来自分类Dev

如何从Dojo层加载AMD模块

来自分类Dev

使用 SystemJS 加载捆绑的 AMD 模块

来自分类Dev

无法使用JSPM实例化kendo.directives模块

来自分类Dev

如何在CDN和本地回退中使用System.js?

来自分类Dev

如何在本地加载wasm模块?

来自分类Dev

使用 --input-type 时无法加载本地目录 Node.js 模块

来自分类Dev

由system.js加载脚本时如何要求('electron')

来自分类Dev

如何使用System.js在最小的Angular 2应用程序中加载RxJS?

来自分类Dev

如何加载在单个文件中定义的多个命名AMD模块?

来自分类Dev

如何在节点中加载单个AMD模块?

来自分类Dev

使用AMD模块和打字稿加载Bootstrap

来自分类Dev

Python 3 - 如何正确加载模块

来自分类Dev

如何使用System.js导入socket.io-client?

来自分类Dev

如何使用System JS Builder捆绑Angular 2?

来自分类Dev

无法加载模块“ System.Random”

来自分类Dev

如何告诉System.js忽略导入

来自分类Dev

如何告诉System.js忽略导入

来自分类Dev

Java-从System.in加载正确的XML

来自分类Dev

--out旁边仅支持“ amd”和“ system”模块

来自分类Dev

如何使用System.Speech

来自分类Dev

使用SystemJS / JSPM加载多版本的Web组件依赖项吗?

来自分类Dev

使用jspm配置运行Typescript angular2应用程序的页面加载错误

Related 相关文章

热门标签

归档