Rollup.js объединение изображений

В мире веб-пакетов я могу объединять и получать доступ к изображениям в виде URL-адресов следующим образом, используя загрузчик файлов

Вот так:

const webpackConfig = {
  // ...
  module: {
    rules: [
      {
        test: /\.(jpg|png|svg)$/,
        use: [
          {loader: 'file-loader?name=[path][name].[hash].[ext]'}
        ],
        include: paths
      }
    ]
  }
}

И используя это, например, в компоненте реакции:

import foo from 'assets/images/foo.png'

function ReactFunctionalComponent () {
  return (<img src = {foo} />)
}

Это поместит foo с путем к изображению

Есть ли способ сделать то же самое с rollup js, чтобы я мог иметь ресурс изображения в виде URL-адреса с хешем внутри пакета?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
1
0
6 584
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете добавить функциональность к свертке с помощью плагинов. В этом случае используйте rollup-plugin-image (https://github.com/rollup/rollup-plugin-image) или rollup-plugin-img (https://github.com/alwaysonlinetxm/rollup-plugin-img), что кажется более гибким.

Учет этого приема позволяет увеличить размер файла.

Важная деталь об этом плагине: Images are encoded using base64, which means they will be 33% larger than the size on disk. You should therefore only use this for small images where the convenience of having them available on startup

bhdrk 07.01.2019 11:33

Другие вопросы по теме