Как сделать чтобы Webpack не конвертировал изображения в Base64 в определенной папке?

Question

[DanyGersh]

Я работаю над проектом ReactJS. В

src/assets/img/emojis/(какая-то_картинка.png

есть папка с эмодзи. Когда я собираю проект, main.475f5380.js становится размером 30 мб, и это очень плохо. Как это исправить и поместить все изображения эмодзи в папку

build/static/media

(или другую)?

Конфигурация Webpack (приложение create-реагировать по умолчанию): GDrive

Comments

[Василий Банников]

Реакт не отвечает за сборку.
Скорее всего в проекте есть ещё и вебпак - надо смотреть на его конфиг

[DanyGersh]

Василий Банников, Стандартный от create-react-app. Я попытался найти решение, но не смог

[Василий Банников]

DanyGersh, какой именно "стандартный"?

Пиши cra eject и скидывай конфиг сюда

[Mikhail Osher]

DanyGersh eject делали?

Answer 1

[Mikhail Osher]

Задайте кастомный IMAGE_INLINE_SIZE_LIMIT через переменные окружения.

https://create-react-app.dev/docs/advanced-configu...

Если нужно конкретно для определеной папки, то найдите следующий блок, скопируйте его, и в верхнем укажите регулярку, которая удовлетворит папку с emoji.

// "url" loader works like "file" loader except that it embeds assets
            // smaller than specified limit in bytes as data URLs to avoid requests.
            // A missing `test` is equivalent to a match.
            {
              test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
              type: 'asset',
              parser: {
                dataUrlCondition: {
                  maxSize: imageInlineSizeLimit,
                },
              },
            },

Answer 2

[Альберт Ефремов]

Кодирует не реакт, а сборщик проекта, по всей видимости webpack и его лоадеры. Смотреть нужно в этом направлении.

Comments

[DanyGersh]

Я попытался найти решение, но не смог. Вы случайно не знаете как это можно решить?