Система JS не импортирует - PullRequest
Новая
       22

Система JS не импортирует

1 голос
/ 08 мая 2020

Невозможно использовать машинописный текст с системой JS. Это мой тестовый пример:

tsconfig. json

{
  "compilerOptions": {
    "module": "System",
    "target": "es2015",
    "outFile": "./lib/mylib.js"
  },

  "include": [
    "./src/mylib.ts"
  ]
}

lib / mylib.ts 

export default class MyClass {
    constructor(public readonly msg: string) { }

    public print() {
        console.log(this.msg)
    }
}

test . html

<html>
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/6.3.1/system.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/6.3.1/extras/named-register.js"></script>
    <script src="lib/mylib.js"></script>
    <script src="test.js"></script>
</head>
<body>
</body>
</html>

lib / mylib. js

System.register("mylib", [], function (exports_1, context_1) {
    "use strict";
    var MyClass;
    var __moduleName = context_1 && context_1.id;
    return {
        setters: [],
        execute: function () {
            MyClass = class MyClass {
                constructor(msg) {
                    this.msg = msg;
                }
                print() {
                    console.log(this.msg);
                }
            };
            exports_1("default", MyClass);
        }
    };
});

тест. js

System.import('mylib').then(() => {
    let mc = new MyClass('My message')
    mc.print()
})

Получение ошибки: test.js:2 Uncaught (in promise) ReferenceError: MyClass is not defined at test.js:2

Я пытаюсь использовать Систему JS, так как мне нужно загрузить MyClass локально (без CORS). Я бы использовал модули ES6, но импорт модулей локально запрещен.

1 Ответ

1 голос
/ 08 мая 2020

Единственная проблема, которую я мог обнаружить, заключается в том, что браузер пытается найти MyClass на всем глобальном объекте, чтобы увидеть, сохраняет ли он его. Но System JS загружает модули динамически и возвращает их внутри обещания, поэтому вы включите его следующим образом: 

System.import('mylib').then((importedObject) => {
  const MyClass = importedObject.default
  let mc = new MyClass('My message')
  mc.print()
})

Это просто вернет вам importedObject, а затем вы можете указать, какой импорт вы хочу использовать. В этом случае вы хотите использовать экспорт по умолчанию, поскольку он хранит ваши MyClass.

...