Модули JavaScript ES6 + traceur

Question

Я использую модули ES6, перенесенные в ES5 с помощью traceur.
Транспиляция осуществляется через grunt + grunt-traceur

Traceur позволяет вам выбрать, какой обработчик модуля использовать: собственный, AMD, commonJS или встроенный.
Я пробовал большинство из них, но ни один из них не работает. Зачем?

TestClass.js

export default class TestClass {
    constructor() {
        alert('test');
    }
}

Main.js

import TestClass from './TestClass';

var test = new TestClass();

Gruntfile.js (выдержка)

traceur: {
    options: {
        experimental: true,
        blockBinding: true,
        modules: 'amd'
    }
}

index.html (выдержка)

<script src="js/vendor/traceur-runtime.js"></script>
<script src="js/vendor/require.js"></script>

<script defer async src="js/compiled/Main.js"></script>

Ошибка дана

Uncaught Error: Несоответствующий анонимный модуль define(): функция ($__0) {

Кажется, что есть проблемы с плагином grunt, но даже использование более старой версии, похоже, не помогает.

Код был адаптирован из статьи.

Answer 1

Кажется, у меня была очень похожая проблема (и я погуглил ваш вопрос, пытаясь найти решение).

Я не видел ошибку, предоставленную вами, в любом случае, опубликовать здесь мою реализацию, может быть, это поможет вам.

Прежде всего, вам нужно загрузить оба js-скрипта со средой выполнения treceur. Как это:

<script src="js/vendor/traceur-runtime.js"></script>
<script defer async src="js/compiled/TestClass.js" type="module"></script>
<script defer async src="js/compiled/Main.js" type="module"></script>

Обратите внимание, что вы должны указать, что ваши сценарии module-с в type приписывать.

Чем вам нужно загрузить модуль инициализации:

<script>
    System.get('public_js/init'); 
    // pass your init module name as a parameter
    // you can see it in private __moduleName variable in compiled init.js
</script>

Эта реализация хорошо работает для меня. Я использую 0.2.9 версию grunt-traceur и 0.0.72 версию среды исполнения Treceur. Надеюсь, это поможет вам.