我在使用es6，JSPM和system.js的Aurelia項目中使用本地AMD模塊非常困難。我希望有人能幫助我配置我的項目，使我能夠導入/加載我的AMD模塊並將其用於我的項目。當地的AMD的風格模塊是類似於以下格式：如何使用jspm/system.js正確加載本地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: { 
    ... 
    "lib/alerts/*.js": { 
     "format": "amd" 
    } 
}

沒有人有，爲什麼我遇到了我看到的錯誤，以及如何正確地加載模塊，我的任何想法？我很感謝您提供的任何幫助/見解。

UPDATE

我終於明白了這裏的主要問題是，我想在和奧裏利亞項目利用現有的AMD模塊，默認奧裏利亞一飲而盡構建假設所有的代碼寫在ES6，而不是混合與AMD。這就是我遇到問題的原因。 Vanilla jspm/system.js可處理模塊格式的混合，但Aurelia並不是開箱即用的。

來源

2015-12-28 jbgarr

Aurelia的這個假設在哪裏？你怎麼能確定它不是SystemJS或巴貝爾如何運輸？ – Andrew

我也很難過。我試圖導入這個庫（http://savvior.org/），它應該是一個AMD模塊，但我無法得到它的工作。我通過'jspm install npm：savvior'安裝了它，但我似乎可以在我的視圖模型中正確導入它。 – emzero

@Andrew Aurelia框架應用程序的配置文件正在做這個假設。我不知道自從我使用的版本以來事情已經發生了變化，但是在'build/tasks/build.js'文件中，gulp正在通過Babel將'src'文件夾中的所有文件轉換爲AMD模塊。我用SystemJS測試了一些東西，它支持並排加載不同類型的模塊。問題在於，當您嘗試傳輸已經採用AMD格式的模塊時。這就是爲什麼解決方案是簡單地將AMD模塊放在'src'文件夾之外，所以Gulp/Babel不會嘗試傳輸它們。 – jbgarr

只需將您的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';

來源

2016-01-05 08:26:00 valichek

太棒了，謝謝！我以爲我將不得不重新配置我的gulp構建任務。這很容易。 – jbgarr

如何使用jspm/system.js正確加載本地AMD模塊

UPDATE

回答

相關問題