Потрясающий TypeScript/JavaScript, общий для браузера и узла

Question

Я работаю над проектом TypeScript, который содержит различные модули, совместно используемые клиентом браузера и сервером на основе Node. Мы хотели бы связать и расшатать модули с помощью webpack/rollup для браузера, который требует настройки компилятора TypeScript для целевой ES6, чтобы сохранить импорт. Однако, чтобы работать на Node, нам нужно ориентироваться на ES5, который превращает импорт в требования и, таким образом, предотвращает тряску деревьев.

Есть ли элегантный способ решить эту проблему, не компилируя все дважды, один раз в ES5 и снова в ES6?

Answer 1

Возможные решения:

.1 В обоих случаях выберите один ES6, но в случае узла используйте дополнительный шаг свертки с включенной внешней опцией и целевой ES5. В таком случае tsc гарантирует удаление всех типовых аннотаций и других связанных с типом вещей, тогда Rollup выполняет тяжелую работу, трансформируя ES6 → ES5 и сотрясая дерево. Вам понадобится JavaScript API Rollup, поскольку CLI API поддерживает только external = string[] с конкретными модулями, но вам нужно "все внешнее". В этом случае JavaScript API: external: (id) => id != main_file,

недостатки:

• в этом случае вы не можете использовать Rollup CLI API, вам нужно написать скрипт

.2 Используйте Rollup в качестве основного игрока и https://github.com/rollup/rollup-plugin-typescript для создания двух разных целей с Rollup: ES5 и ES6. Генерация множества целей из одного пакета довольно проста в Rollup.

недостатки:

• rollup-plugin-typcript, даже если он официально живет под крылом организации Rollup, развивается очень медленно. Я не могу охарактеризовать его как "стабильный".

.3 Создайте только ES6 и используйте ESM для цели Node. Вы можете узнать больше по ссылке, но на самом деле это уже хорошо работает, и производительность будет в порядке.

недостатки:

• поставка ESM требует патчера для цели Node (просто)

.4 Если ваша основная проблема с "компиляцией всего дважды" - это скорость, то делать полную сборку (даже если она собиралась дважды) только в рабочей среде. Вы можете ввести несколько простых скриптов, делая только необходимые действия в dev и используя tscх (или свертка) --watch способность.