@webpackon/use-url-images

Features:
- adds support imports images as url from scripts and css files
- transforming jpeg to progressive jpeg (default)
- minification svg (default)

Supported extensions:
- png
- jpg
- jpeg
- gif
- webp
- svg

Install

shell
npm i @webpackon/use-url-images --save

`shell yarn add @webpackon/use-url-images`

`API`

`ts const { useUrlImages } = require('@webpackon/use-url-images');

useUrlImages(params: UseUrlImagesParams)(config: WebpackConfig)`

`$3`

ts
type UseUrlImagesParams = {
  mode: 'development' | 'production';
  loaderParams?: {
    generator?: Record;
  };
  imageminPlugins?: Array<[string, Record]>;
  transpileModules?: string[];
};

- `mode`- webpack mode -`loaderParams.generator`- webpack option -`imageminPlugins` - image-minimizer-webpack-plugin `plugin`option -`transpileModules``ts useUrlImages({ mode: 'production', transpileModules: ['my-package'] })`

`Example`


Full examples are here

`webpack.config.js``js const path = require('path');

const { compose } = require('@webpackon/core'); const { useUrlImages } = require('@webpackon/use-url-images');

module.exports = (_, { mode }) => compose( useUrlImages({ mode }), )({ target: 'web', entry: path.resolve(__dirname, 'src', 'index.tsx'), });`

`example.js``js import myImageSrc from 'public/images/myImage.svg';

... ...`

`example.css``css article { background-image: url('~public/images/bg-image.jpg'); }``

Webpackon