Разбиение кода с помощью Webpack для Intl polyfill
Я пытаюсь создать пакет для intl
Polyfill, чтобы загрузить его только для браузера, который этого требует.
Используя следующий код, он создает пакет в моей выходной папке
if (!window.Intl) {
require.ensure(['intl/dist/Intl'], (require) => {
window.Intl = require('intl/dist/Intl');
}, 'intl-bundle');
}
Первое, что я заметил, это размер файла огромен, он содержит все языки, есть ли способ определить языки, которые я хочу?
Другая проблема заключается в том, что когда браузер пытается загрузить файл, он пытается из корневой папки моего приложения. Так что вместо скачивания http://mydomain/js/1.intl-bundle.js
пытается получить http://mydomain/1.intl-bundle.js
Есть ли способ установить откуда файл должен быть загружен?
мой webpack.config.js
вывод выглядит так:
output: {
path: './js/',
filename: '[name].js'
},
И последний вопрос, могу ли я удалить 1.
в начале имени файла, просто чтобы intl-bundle.js
?
Спасибо
1 ответ
На самом деле я собираюсь ответить на несколько моих собственных вопросов, так как я только что нашел решение после нескольких часов исследований.
По второму вопросу я не определяю publicPath
в моей сборке, которая была причиной, по которой браузер загружал файл из корня моего домена. Дополнительная информация: https://github.com/webpack/docs/wiki/configuration
output: {
path: './js/',
publicPath: './js/'
}
В последнем вопросе вы можете назвать свои куски следующим образом:
output: {
chunkFilename: '[id]-[name]-[chunkhash].js'
}
Это позволяет вам определить имя ваших кусков.
У меня до сих пор нет ответа, чтобы уменьшить размер файла intl.