Возможен ли корректный treeshaking с vue-cli-service?

Question

[Алексей Николаев]

Доброй ночи.
Есть небольшой пакет утилит, импорт из него.

import { formateDate, fromNow } from '@vendor/utils/date'

В пакете всего 3 функции. Присутствует также функция fromTo, которая в проекте не используется.

Webpack из-под vue-cli-service собирает проект, создает чанки, в число которых входит и chunk-vendors.js, который содержит как раз таки нужные импорты от вендоров. Проблема в следующем: несмотря на то, что в проекте нет импорта fromTo из '@vendor/utils/date', в chunk-vendors.js эта функция все равно есть.

Такая же ситуация со всеми остальными сторонними пакетами. Это приводит к раздуванию размеров бандла даже несмотря на то, что он multipage, за счет включения в него функций и методов, которые фактически нигде не используются и никогда не будут вызваны.

Как бороться? Есть ли способы? Как я понимаю, treeshaking не работает \ не настроен?
Заранее спасибо.

Comments

[Кирилл Романов]

Тут важно, как собраны утилиты, они со своей стороны должны поддерживать tree shaking.

[Алексей Николаев]

Кирилл Романов, интересно. А знаете какие-нибудь статьи \ мануалы?

[Кирилл Романов]

https://medium.com/@kelin2025/so-you-wanna-use-es6...

Answer 1

[profesor08]

Значит функция fromTo используется где-то еще в импортированных функциях. Если есть какая-то зависимость в твоем коде, или в импортируемом, то функция будет включена. Иначе же все сломается.

Более того, утилита должна быть построена на ES2015 импортах и экспортах, если же там стоит какой-то module.exports, то подключится все, так как этот тупо объект, а fromTo его часть.