Как скомпилировать модули ES6 с помощью Google Closure Compiler - PullRequest
1 голос
/ 09 января 2020

Я просматривал код для прошлого проекта, прежде чем реализовывать некоторые новые функции. Одна из целей состояла в том, чтобы упростить управление кодом путем его миграции на модули ES6. Все прошло хорошо, и жизнь стала намного проще.

Однако в процессе создания финального приложения мы использовали Google Closure Compiler для минимизации кода. Это работало хорошо, но теперь ...

Возьмите этот пример HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML file to test compilation of JS modules</title>
</head>
<body>

<script src="JSModule1.js" type="module"></script>
</body>
</html>

и добавьте эти два модуля

JSModule1. js

import {Thing} from './JSModule2.js'

let item = new Thing('Something');
let otherItem = new Thing();

item.speak();
otherItem.speak();

JSModule2. js

function Thing(word) {
    let words = (word || "I've nothing to say.");
    this.speak = function() {
        console.log(words);
    }
}

export {Thing}

Если я пытаюсь скомпилировать просто JSModule1.js, я получаю ошибку:

JSC_JS_MODULE_LOAD_WARNING: Failed to load module "./JSModule2.js"

Если я настрою процесс загрузки для отправки обоих файлов в одну и ту же компиляцию, я получу монолитный c блок кода, включающий оба модуля:

function Thing$$module$JSModule2(a){var b=a||"I've nothing to say.";this.speak=function(){console.log(b)}}var module$JSModule2={};module$JSModule2.Thing=Thing$$module$JSModule2;var item$$module$JSModule1=new Thing$$module$JSModule2("Something"),otherItem$$module$JSModule1=new Thing$$module$JSModule2;item$$module$JSModule1.speak();otherItem$$module$JSModule1.speak();var module$JSModule1={};

Это что отправлено компилятору в строке запроса:

compilation_level=SIMPLE_OPTIMIZATIONS&output_format=xml&output_info=compiled_code&language=ECMASCRIPT6_STRICT&js_code%3A.%2FJSModule1.js=import+%7BThing%7D+from+%27.%2FJSModule2.js%27%0A%0Alet+item+%3D+new+Thing%28%27Something%27%29%3B%0Alet+otherItem+%3D+new+Thing%28%29%3B%0A%0Aitem.speak%28%29%3B%0AotherItem.speak%28%29%3B&js_code%3A.%2FJSModule2.js=function+Thing%28word%29+%7B%0A++++let+words+%3D+%28word+%7C%7C+%22I%27ve+nothing+to+say.%22%29%3B%0A++++this.speak+%3D+function%28%29+%7B%0A++++++++console.log%28words%29%3B%0A++++%7D%0A%7D%0A%0Aexport+%7BThing%7D%0A&output_info=errors&output_info=warnings&output_info=statistics

Итак, если я хочу скомпилировать только один модуль, я не могу этого сделать. Я должен скомпилировать его вместе с любыми модулями, которые он импортирует. Если я сделаю это для набора модулей, каждый из которых имеет несколько зависимостей, то я мог бы получить больше кода, чем если бы я не скомпилировал их изначально.

Единственный подход, по-видимому, состоит в том, чтобы компилировать все приложение одновременно и работать с полученным единым блоком кода.

Теперь кажется, что я могу скомпилировать JSModule2.js без ошибок, но для реального приложения модули имеют как минимум еще одну зависимость, а иногда и больше, поэтому я снова возвращаюсь к компиляции все это.

Вопрос: Есть ли какой-нибудь способ заставить компилятор Closure компилировать модули без компиляции всех зависимостей одновременно?

...