Как включить дополнительные источники ES6 в приложение Angular

У меня есть модуль пользовательского режима, написанный на синтаксисе ES6, который я включаю в мое угловое приложение, и у меня возникают проблемы (из uglifyjs), когда я пытаюсь собрать приложение с -prod флагом -prod:

Unexpected token: punc ()

Это угловое приложение, использующее Angular-Cli 1.7.4 также.

Файл ввода для моего модуля узла выглядит следующим образом:

const MyModule = require('./src/index.js');

const myModule = new MyModule();

module.exports = {
  doStuff: myModule.doStuff,
  doOtherStuff: myModule.doOtherStuff
}

Затем это становится обязательным в одном из моих файлов TS, например, так:

import MyModule = require('@acme/mymodule');

При запуске задачи ng serve у меня нет проблем, и я могу использовать приложение, как и ожидалось.

При попытке создать производственную сборку я вижу эту проблему.

В файле. /src/index.js есть много определенных функций, которые используют const\let\async\await.

Читая вокруг, я полагаю, что это зависит от меня, используя ES6 и источники, несовместимые с uglifyjs под капотом, когда angular cli выполняет шаги сборки.

Из того, что я также прочитал, настройкой веб-пакета можно управлять из конфигурации angular-cli, по крайней мере, не в 1.x, в противном случае я бы попробовал один из множества плагинов, чтобы помочь мне обойти это.

Я предполагаю, что мне нужно выполнить код через дополнительный шаг, прежде чем он достигнет angular-cli, например, использовать babel для преобразования моего кода es6.

Я изо всех сил пытаюсь найти примеры того, как сделать это по отношению к angular и cli, я могу найти, как использовать babel, и смог проверить это на одном из моих исходных текстов модуля узла и могу увидеть версию es5 этого продукта.,

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

Кстати, не уверен, насколько это актуально, но в моем файле polyfills.ts включены следующие полифилы:

import "core-js/es5";
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';

Я ценю любой совет, который вы можете дать!

Спасибо

ОБНОВИТЬ

Я создал минимальное приложение Angular 5, которое использовало 1.x angular-cli. Я повторил поведение сборки в этом, которое также генерирует ошибку из UglifyJS.

Вы можете найти приложение на моем Github здесь

Я видел, что UglifyJS, используемый в версии Webpack, используемой angular-cli, не поддерживает перенос es6.

Без миграции угловых версий \cli мне интересно узнать, есть ли способ заставить образец приложения скомпилироваться для производства и функционировать без каких-либо проблем.

ОБНОВЛЕНИЕ 2

Поэтому после еще нескольких экспериментов я пришел к выводу, что наиболее изящный способ обработки трансплантации ES6 при создании приложения Angular 5 состоит в использовании ng eject для получения файла webpack.config.js и настройки uglifyjs-webpack-plugin как описано в этом uglifyjs-webpack-plugin статья

Это прекрасно работает и на самом деле позволяет более точный контроль над веб-пакетом, который angular-cli скрывает от вас изначально.

Я открыт для других предложений\ответов, поэтому не стесняйтесь добавлять сюда!

Я все еще хотел бы найти способ использовать angular-cli, если это вообще возможно.

Ответ 1