feat: add encoding & generator options

README.md

@@ -236,6 +236,63 @@ module.exports = {
 };
 ```
 
+### `source`
+
+Type: `Function`
+Default: `data:${mimetype || ''};${encoding},${src.toString(encoding)}`
+
+You can create you own custom implementation for encoding data. in the example we are compressing svg files using [mini-svg-data-uri](https://github.com/tigt/mini-svg-data-uri) implementation.
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.svg$/i,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              source: (svgContent) => {
+                const svgToMiniDataURI = require('mini-svg-data-uri');
+
+                return svgToMiniDataURI(svgContent);
+              },
+            },
+          },
+        ],
+      },
+    ],
+  },
+};
+```
+
+By using your own implementation, `mimetype` and `encoding` won't have effect on the final output. until you specify them in the output manually for Example:
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.svg$/i,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              source: (svgContent) => {
+                return `data:image/svg;utf8,${svgContent}`;
+              },
+            },
+          },
+        ],
+      },
+    ],
+  },
+};
+```
+
 ### `esModule`
 
 Type: `Boolean`

package.json

@@ -49,6 +49,7 @@
   "dependencies": {
     "loader-utils": "^2.0.0",
     "mime-types": "^2.1.26",
+    "mini-svg-data-uri": "^1.1.3",
     "schema-utils": "^2.6.5"
   },
   "devDependencies": {

src/index.js

@@ -46,11 +46,13 @@ export default function loader(src) {
     const esModule =
       typeof options.esModule !== 'undefined' ? options.esModule : true;
 
+    const encodedData = options.source
+      ? options.source(src)
+      : `data:${mimetype || ''};${encoding},${src.toString(encoding)}`;
+
     return `${
       esModule ? 'export default' : 'module.exports ='
-    } ${JSON.stringify(
-      `data:${mimetype || ''};${encoding},${src.toString(encoding)}`
-    )}`;
+    } ${JSON.stringify(encodedData)}`;
   }
 
   // Normalize the fallback.

src/options.json

@@ -19,6 +19,10 @@
         "ucs2"
       ]
     },
+    "source": {
+      "description": "Adding custom implementation for encoding files.",
+      "instanceof": "Function"
+    },
     "mimetype": {
       "description": "The MIME type for the file to be transformed (https://github.com/webpack-contrib/url-loader#mimetype).",
       "type": "string"

test/source-option.test.js

@@ -0,0 +1,55 @@
+import {
+  compile,
+  execute,
+  getCompiler,
+  normalizeErrors,
+  readAsset,
+} from './helpers';
+
+const svgToMiniDataURI = require('mini-svg-data-uri');
+
+describe('"source" option', () => {
+  it('should work with unspecified value with the default base64 encoding', async () => {
+    const compiler = getCompiler('simple-svg.js');
+    const stats = await compile(compiler);
+
+    expect(
+      execute(readAsset('main.bundle.js', compiler, stats))
+    ).toMatchSnapshot('result');
+    expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('assets');
+    expect(normalizeErrors(stats.compilation.warnings)).toMatchSnapshot(
+      'warnings'
+    );
+    expect(normalizeErrors(stats.compilation.errors)).toMatchSnapshot('errors');
+  });
+  it('should work with "Function" right mini-svg-data-uri encoding', async () => {
+    const compiler = getCompiler('simple-svg.js', {
+      source: (file) => svgToMiniDataURI(file.toString()),
+    });
+    const stats = await compile(compiler);
+
+    expect(
+      execute(readAsset('main.bundle.js', compiler, stats))
+    ).toMatchSnapshot('result');
+    expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('assets');
+    expect(normalizeErrors(stats.compilation.warnings)).toMatchSnapshot(
+      'warnings'
+    );
+    expect(normalizeErrors(stats.compilation.errors)).toMatchSnapshot('errors');
+  });
+  it('should work with "Function" that return the encoding manually', async () => {
+    const compiler = getCompiler('simple-svg.js', {
+      source: (content) => `data:image/svg+xml;utf8,${content}`,
+    });
+    const stats = await compile(compiler);
+
+    expect(
+      execute(readAsset('main.bundle.js', compiler, stats))
+    ).toMatchSnapshot('result');
+    expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('assets');
+    expect(normalizeErrors(stats.compilation.warnings)).toMatchSnapshot(
+      'warnings'
+    );
+    expect(normalizeErrors(stats.compilation.errors)).toMatchSnapshot('errors');
+  });
+});