Не удается получить загрузчик babel для добавления полифилла для String.prototype.trimLeft () (он же trimStart) - PullRequest
0 голосов
/ 16 февраля 2019

Я связываю свой javascript с webpack / babel-loader (с параметром @ babel / preset-env "useBuiltIns: 'using" "), и во время компиляции полифилл String.prototype.trimStart () не получаетдобавлено.Я попытался использовать его альтернативное имя «trimLeft ()», но все равно не повезло.Это ошибка или я делаю что-то не так?

Я использую Node на Mac, у меня есть @ babel / polyfill в качестве зависимости проекта, и у меня есть @ babel / core, @ babel / preset-envи babel-загрузчик как devDependencies (а также веб-пакет).Мои конфигурации babel находятся в моем файле webpack.config.js.

Я использую babel-loader в режиме отладки, поэтому я могу видеть, какие полифилы добавляются в какие модули;насколько я могу судить, проблема заключается только в trimLeft / trimStart.В результате при запуске моего приложения в IE выдается ошибка.

из package.json:

"dependencies": {
    "@babel/polyfill": "^7.2.5"
},
"devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.3.1",
    "babel-loader": "^8.0.5",
    "webpack": "^4.29.1",
    "webpack-cli": "^3.2.1"
}

из webpack.config.js (в пределах module.exports.module.rules):

use: {
    loader: 'babel-loader',
    options: {
        presets: [
            ['@babel/preset-env', {
                useBuiltIns: 'usage',
                debug: true,
                targets: {
                    browsers: ['IE >= 10']
                }
            }]
        ]
    }
}

Из модуля, в котором я использую String.prototype.trimLeft () (в функции стрелки экспорта по умолчанию):

const messageInput = document.querySelector('#message-input');
const usernameInput = document.querySelector('#username-input');

messageInput.addEventListener('keydown', handleKeydown);
usernameInput.addEventListener('keydown', handleKeydown);

function handleKeydown(event) {
    if (event.key === 'enter') {
        const username = usernameInput.value.trim();
        const text = messageInput.value.trimLeft();

        // etc.
    }
}

В браузерах, которые поддерживают trimLeft () / trimStart (), этот код работает нормально.Я добавлю, что когда я экспериментировал с изменением настроек babel для браузера, который не поддерживает trim (), во время компиляции в этот модуль был импортирован polyfill trim ().

...