Как вы создаете, связываете и минимизируете модули ES6?

Интересно, как мне минифицировать и подготовить релиз-файл проекта?

Что является целью этого действия? Хорошо, мини-файлы потребляют меньше сетевого трафика и будут загружаться быстрее, но большинство библиотек NPM уже предоставляют мини-файлы dist. И главный вопрос по поводу объединения в один большой файл.

Зачем вебпак это делает? Конечно, из-за отсутствия поддержки ES-модулей в браузере нативным, Почему веб-пакет разрешает import инструкции и округляет зависимости синхронно*, а затем подменяет его на IIFE для области видимости. И выполнять трансляцию и полифиллинг Babel, да.

Но потом запускается нативная поддержка ES-модулей, она становится никому не нужна. Одной из основных целей при развертывании вашего веб-приложения в рабочей среде является минимизация объема трафика для вашего сервера с помощью CDN. Теперь вы можете сделать это нативным способом, так что просто импортируйте ES-модули из unpkg.org и будьте счастливы

* Если не использовать HMR, конечно, но это не подходит для производственного режима.

Живые примеры здесь: https://jakearchibald.com/2017/es-modules-in-browsers/

В этом блоге объясняется, как можно использовать ES6 module syntax и при этом связать свой код во что-то, понятное браузеру.

В блоге объясняется, что использование SystemJs в качестве ES6 module polyfill и Babel вместе с Gulp позволит вам кодировать свои модули в ES6, но при этом вы сможете использовать его сегодня.

https://www.barbarianmeetscoding.com/blog/2016/02/21/start-using-es6-es2015-in-your-project-with-babel-and-gulp/

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

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