#webpack #bundling-and-minification #tree-shaking
Вопрос:
Я создаю библиотеку пользовательского интерфейса vue (формат пакета > esm),
Это нормально работает в моем приложении, за исключением одной проблемы: я ожидал, что при создании своего приложения Webpack будет извлекать из моей библиотеки пользовательского интерфейса только компоненты, которые я использую, а не всю библиотеку. Но произошло обратное.
Webpack создает блок поставщика, содержащий всю библиотеку пользовательского интерфейса, хотя я использую только 1 компонент:
import { OneComponent } from 'my-lib';
NB: Я использую Webpack 4.46.0
;
Правила веб-пакета:
{
test: /.vue$/,
loader: 'vue-loader',
},
{
test: /.tsx?$/,
exclude: /node_modules/,
use: [
{
loader: 'babel-loader',
options: {
comments: true,
presets: ['@babel/preset-env'],
plugins: ['transform-vue-jsx'],
},
},
{
loader: 'ts-loader',
options: {
appendTsSuffixTo: [/.vue$/],
},
},
],
}
Я был бы признателен, если бы вы помогли мне встряхнуть дерево моего поставщика.