Webpack настройка

Question

С Webpack'ом работаю не первый день но в тонкостях разобрался еще не полностью и проблема касается Webpack Babel - когда у меня код состоит из 150-200 строчек написанный в современном синтаксисе и мне нужно чтобы он перекомпилировался в код ES5-6 синтаксиса для понимания браузерами, но возникает проблема что после компиляции создается бандл в котором присутствует помимо моего кода еще 9тыс+ строчек как минимум, как я понимаю Babel'овских функций. Как можно исправить проблему, убрав лишний код и оставив мой в старом синтаксисе?

Часть настроек из Webpack config

entry: {
    index: ["@babel/polyfill", './index.js']
},
module: {
   rules: [
        {
            test: /\.js$/,
            exclude: /node_modules/,
            use: {
                loader: 'babel-loader',
                options: {
                    presets: ['@babel/preset-env'],                        
                    plugins: [
                        "@babel/plugin-proposal-private-property-in-object",
                        "@babel/plugin-proposal-private-methods",
                        "@babel/plugin-proposal-class-properties",
                        "@babel/plugin-proposal-class-static-block",
                        "@babel/plugin-proposal-numeric-separator"
                    ]
                }
            }
        }
   ]
}

Исходный код скрипта(пример):

class Porcshe{
    constructor(model, price){
        this.model = model
        this.price = price + '$'
    }

    getInfo(){
        let model, price

        model = 'Car: Honda ' + this.model
        price = 'Price: ' + this.price

        return model + '\n' + price
    }
}

let car = (new Porcshe('911 turbo S', 210_000)).getInfo()

Выходной файл после транспиляции(6тыс+ строк):

(()=>{var t={8391:(t,r,n)=>{"use strict";n(3048),n(9247),n(8128),n(241),n(4918),n(9839),n(8878),n(3090),n(4184),n(1587),n(338),n(49),n(1497),n(6248)},3048:(t,r,n)=>{n(9823),n(9701),n(5843),n(8344),n(541),n(8904),n(4978),n(9770),n(8338),n(7941),n(3668),n(7070),n(9163),n(3310),n(9773),n(9020),n(4210),n(6139),n(8629),n(9745),n(5694),n(6130),n(5821),n(6349),n(8110),n(3689),n(2211),n(3730),n(6729),n(7374),n(2095),n(6362),n(6329),n(7463),n(5874),n(5886),n(91),n(6799),n(1570),n(6006),n(8377),n(108),n(905),n(8103),n(5937),n(9979),n(3601),n(4226),n(9750),n(1462),n(4773),n(2421),n(2763),n(1711),n(183),n(7472),n(516),n(427),n(3777),n(7238),n(5942),n(513),n(4186),n(5502),n(6213),n(9457),n(9876),n(9772),n(7174),n(5251),n(7984),n(3359),n(195),n(8586),n(817),n(5337),n(5079),n(5105),n(4163),n(5867),n(9606),n(9174),n(8466),n(7209),n(1796),n(7772),n(286),n(4434),n(3231),n(46),n(9399),n(8312),n(5155),n(3133),n(1601),n(453),n(1954),n(8703),n(652),n(7680),n(5506),n(5846),n(4321),n(751),n(4828),n(4208),n(2679),n(9236),n(2235),n(1239),n(8392),n(773),n(3623),n(345),n(8460),n(6788),n(6780),n(3620),n(3958),n(1592),n(5469),n(6471),n(3149),n(4637),n(1335),n(2603),n(4460),n(5970),n(4288),n(2039),n(4613),n(122),n(9484),n(1014),n(7150),n(8982),n(8868),n(8633),t.exports=n(66)},8128:(t,r,n)=>{n(7328),t.exports=n(66).Array.flatMap},9247:(t,r,n)=>{n(8081),t.exports=n(66).Array.includes},338:(t,r,n)=>{n(9716),t.exports=n(66).Object.entries},4184:(t,r,n)=>{n(7453),t.exports=n(66).Object.getOwnPropertyDescriptors},1587:(t,r,n)=>{n(27),t.exports=n(66).Object.values},49:(t,r,n)=>{"use strict";n(2235),n(6632),t.exports=n(66).Promise.finally},4918:(t,r,n)=>{n(8302),t.exports=n(66).String.padEnd},241:(t,r,n)=>{n(9447),t.exports=n(66).String.padStart},8878:(t,r,n)=>{n(152),t.exports=n(66).String.trimRight},9839:(t,r,n)=>{n(9324),t.exports=n(66).String.trimLeft},3090:(t,r,n)=>{n(3756),t.exports=n(9669).f("asyncIterator")},1829:(t,r,n)=>{n(1739),t.exports=n(7208).global},6610:t=>{t.exports=function(t){if("function"!=typeof t)throw TypeError(t+" is not a function!");return t}},498:(t,r,n)=>{var e=n(9632);t.exports=function(t){if(!e(t))throw TypeError(t+" is not an object!");return t}},7208:t=>{var r=t.exports={version:"2.6.12"};"number"==typeof __e&&(__e=r)},1725:(t,r,n)=>{var e=n(6610);t.exports=function(t,r,n){if(e(t),void 0===r)return t;switch(n){case 1:return function(n){return t.call(r,n)};case 2:return function(n,e){return t.call(r,n,e)};case 3:return function(n,e,i){return t.call(r,n,e,i)}}return function(){return t.apply(r,arguments)}}},5179:(t,r,n)=>{t.exports=!n(472)((function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a}))},8765:(t,r,n)=>{var e=n(9632),i=n(3280).document,o=e(i)&&e(i.createElement);t.exports=function(t){return o?i.createElement(t):{}}},8310:(t,r,n)=>{var e=n(3280),i=n(7208),o=n(1725),u=n(2292),a=n(657),c=function(t,r,n){var s,f,l,h=t&c.F,p=t&c.G,v=t&c.S,g=t&c.P,y=t&c.B,d=t&c.W,x=p?i:i[r]||(i[r]={}),m=x.prototype,b=p?e:v?e[r]:(e[r]||{}).prototype;for(s in p&&(n=r),n)(f=!h&&b&&void 0!==b[s])&&a(x,s)||(l=f?b[s]:n[s],x[s]=p&&"function"!=typeof b[s]?n[s]:y&&f?o(l,e):d&&b[s]==l?function(t){var r=function(r,n,e){if(this instanceof t){switch(arguments.length){case 0:return new t;case 1:return new t(r);case 2:return new t(r,n)}return new t(r,n,e)}return t.apply(this,arguments)};return r.prototype=t.prototype,r}(l):g&&"function"==typeof l?o(Function.call,l):l,g&&((x.virtual||(x.virtual={}))[s]=l,t&c.R&&m&&!m[s]&&u(m,s,l)))};c.F=1,c.G=2,c.S=4,c.P=8,c.B=16,c.W=32,c.U=64,c.R=128,t.exports=c},472:t=>{t.exports=function(t){try{return!!t()}catch(t){return!0}}},3280:t=>{var r=t.exports="undefined"!=typeof window&&window.Math==Math?window:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")();"number"==typeof __g&&(__g=r)},657:t=>{var r={}.hasOwnProperty...

БЛОГ НА HUSL

Webpack настройка

Ответы (0 шт):