2017-02-09 1 views
7

Webpack будет включать в себя все из d3.js в пучке при выполнении import { select } from 'd3', как показано в следующем bundle visualization. проблема может быть решена путем делать import { select } from 'd3-selection', но это поражение цели автоматического дерева встряхивая несколько.Webpack 2 Не Дерево встряхивания D3.js Правильно

Встряхивание деревьев, похоже, работает в простых случаях на нашем небиблиотечном коде.

"modules": false Мы используем в нашей .babelrc для того, чтобы сохранить синтаксис модуля и использовать 'module' решительности в нашем webpack.config.js resolve: { mainFields: ['module', 'browser', 'main'] } для того, чтобы выбрать модуль на основе коды d3 в. Как вы можете видеть, импортированный node_modules/d3/index.js разделен на модули ES6 вместо монолитного пакета браузера или экспорта CommonJS.

Должно ли это быть размещено как проблема на странице gigub webpack или я делаю что-то неправильно? Это использует все последние версии библиотек ([email protected], [email protected] и т.д.)

редактировать: Похоже, что это связано со следующими вопросами:

+0

Просто хотел прокомментировать, что я столкнулся с той же проблемой с Webpack 2.2.1 и d3 4.6.0. Встряхивание дерева работает для других библиотек. Прокомментируйте, если вы нашли какое-либо решение. – Nicd

+0

Похоже, есть новый плагин webpack для обработки Common JS. См. Мой обновленный ответ. – nickytonline

+0

Хотя явная ошибка исправлена ​​(если возможно вообще), я бы рассмотрел возможность импорта из более конкретного модуля. Например. 'import {select} из 'd3-selection'' или даже' import select из' d3-selection/src/select''. –

ответ

1

Встряхивание деревьев будет работать только для модулей ES6, потому что их можно подвергнуть статическому анализу. AMD/CommonJS, который публикует множество библиотек, не может быть, поэтому вы, вероятно, не видите никакого дрожания дерева. Пожалуйста, смотрите https://advancedweb.hu/2017/02/07/treeshaking

UPDATE: Там, кажется, новый WebPack плагин, который способен дерева встряхивания модули Common JS, https://github.com/indutny/webpack-common-shake. Обратите внимание, что репо говорит, что это в альфе.