веб-пакет для связывания библиотеки и

Question

Я использую и создаю библиотеку для своего приложения реагирования. И я столкнулся с огромным импортом, который вредит моему пакету (в настоящее время 1.18 МБ в миниатюрной версии из-за библиотеки ant-design).

var path = require('path');
var webpack = require('webpack');
var config = {
    entry: {
        vendor: ['react', 'react-dom','antd'],
        app: './Scripts/js/app.js',
    },
    output: {
        path: path.join(__dirname, "Scripts/bundles"),
        filename: "[name].bundle.js"
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.less$/,
                use: ['style-loader', 'css-loader', "less-loader"]
            },
            {
                loader: 'babel-loader',
                exclude: /node_modules/,
                test: /\.js$/,
                options: {
                    presets: ['es2015', 'react', 'stage-0'],
                },
            },

        ]
    },
    plugins: [
        new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
        new webpack.optimize.UglifyJsPlugin({ minimize: true }),
        new webpack.optimize.CommonsChunkPlugin({
            name: ['vendor'],
        }),
        new webpack.DefinePlugin({
            'process.env': {
                'NODE_ENV': JSON.stringify('production')
            }
        })
    ],
}
module.exports = config;

And my app

import React from 'react'
import ReactDOM from 'react-dom'
import { DatePicker } from 'antd';
ReactDOM.render(<DatePicker />, document.getElementById('container'));

Эти несколько компонентов, разумеется, не составляют 1,2 млн. Вместе.

Answer 1

Установите babel-plugin-import и добавьте его в опции babel-loader:

options: {
  presets: ['es2015', 'react', 'stage-0'],
  "plugins": [
    ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "css" }]
  ]  
}

Если вы не хотите использовать плагин babel, вам придется импортировать его следующим образом:

import DatePicker from 'antd/lib/date-picker';
import 'antd/lib/date-picker/style/css';