TypeScript для веб без модуля загрузчика? - PullRequest
Новая
       30

TypeScript для веб без модуля загрузчика?

0 голосов
/ 06 апреля 2020

Это очень запутанная тема c для меня на данный момент, и я верю также и для многих других людей. Многие советы, которые распространяются по inte rnet, кажутся очень вводящими в заблуждение.

Что я пытаюсь сделать?

Я пытаюсь создать основную c веб-страницу только с простым TypeScript и HTML. Я хочу включить скомпилированный JavaScript со стандартным тегом <script>, таким как 

<script src="javascriptOutput/myCompiledJsFile.js></script>

, при этом сохраняя возможность использовать обычные функциональные возможности модуля TypeScript, что означает разделение моего кода на разные файлы и их импорт в основном скрипте myCompiledJsFile.js, который я включаю в мой HTML.

В чем проблема?

Со следующими tsconfig.json, 

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs"
    // ...
  }
}

the * Консоль 1035 * всегда выдает эту ошибку: Uncaught ReferenceError: exports is not defined.

Из того, что я прочитал, кажется, что проблема заключается в том, что система модулей указана как commonjs, которая, кажется, не работает без внешнего загрузчик модулей (например, System JS, включенный в Webpack et c.).

Я думаю, что можно использовать TypeScript без одного из этих внешних загрузчиков модулей, если я прав. Но я не знаю, как настроить TypeScript для компиляции таким образом, чтобы браузеры могли запускать скомпилированный код без Uncaught ReferenceError. И я также не знаю, где вы можете найти эту информацию о том, какие браузеры поддерживают какие загрузчики модулей / модульные системы. Нужно ли мне смотреть на JavaScript движок, который запускает браузер (например, V8 для Chrome)?

Я также не хочу работать с любыми "взломами", такими как добавление var scripts = {} или тому подобное или удаление строк в скомпилированном JS.

1 Ответ

0 голосов
/ 12 апреля 2020

В случае, если кому-то интересно: решением моей проблемы было использование встроенной системы модулей ES. Это означает, что вы можете выбрать ES2015 или ES2020 для клавиши module в tsconfig.json в зависимости от того, что поддерживает браузер. Поскольку я хотел запустить свой код только в Chrome (Electron) и Chrome полностью поддерживает ES2020 на сегодняшний день, я решил использовать ES2020 для моей модульной системы.

Если вы решите использовать эти модули, AFAIK, вам нужно добавить атрибут type="module" в тег скрипта: 

<script src="../myJsFolder/myJs.js" type="module"></script>
...