feat: add encoding & generator options (#210)

Author: EslamHiko

README.md

@@ -207,6 +207,94 @@ module.exports = {
 };
 ```
 
+### `encoding`
+
+Type: `String|Boolean`
+Default: `base64`
+
+Specify the encoding which the file will be in-lined with. It supports [Node.js Buffers and Character Encodings](https://nodejs.org/api/buffer.html#buffer_buffers_and_character_encodings) which are `["utf8","utf16le","latin1","base64","hex","ascii","binary","ucs2"]`.
+
+> If you don't want to use any encoding you can set `encoding` to `false` however if you set it to `true` it will use the default encoding `base64`.
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.svg$/i,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              encoding: 'utf8',
+            },
+          },
+        ],
+      },
+    ],
+  },
+};
+```
+
+### `generator`
+
+Type: `Function`
+
+You can create you own custom implementation for encoding data. `generator` argument is a [`Buffer`](https://nodejs.org/api/buffer.html) instance of the file. 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: {
+              generator: (svgContentBuffer) => {
+                const svgToMiniDataURI = require('mini-svg-data-uri');
+
+                return svgToMiniDataURI(svgContentBuffer.toString());
+              },
+            },
+          },
+        ],
+      },
+    ],
+  },
+};
+```
+
+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:
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.svg$/i,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              generator: (svgContentBuffer) =>
+                `data:image/svg;utf8,${svgContentBuffer.toString('utf8')}`,
+            },
+          },
+        ],
+      },
+    ],
+  },
+};
+```
+
 ### `esModule`
 
 Type: `Boolean`

package-lock.json

@@ -73,6 +73,7 @@
     "jest-junit": "^10.0.0",
     "lint-staged": "^10.0.8",
     "memfs": "^3.1.2",
+    "mini-svg-data-uri": "^1.1.3",
     "npm-run-all": "^4.1.5",
     "prettier": "^1.19.1",
     "standard-version": "^7.1.0",

package.json

@@ -37,6 +37,11 @@ export default function loader(src) {
     const file = this.resourcePath;
     const mimetype = options.mimetype || mime.contentType(path.extname(file));
 
+    const encoding =
+      options.encoding === true || typeof options.encoding === 'undefined'
+        ? 'base64'
+        : options.encoding;
+
     if (typeof src === 'string') {
       // eslint-disable-next-line no-param-reassign
       src = Buffer.from(src);
@@ -45,11 +50,15 @@ export default function loader(src) {
     const esModule =
       typeof options.esModule !== 'undefined' ? options.esModule : true;
 
+    const encodedData = options.generator
+      ? options.generator(src)
+      : `data:${mimetype || ''}${encoding ? `;${encoding}` : ''},${
+          encoding ? src.toString(encoding) : src.toString()
+        }`;
+
     return `${
       esModule ? 'export default' : 'module.exports ='
-    } ${JSON.stringify(
-      `data:${mimetype || ''};base64,${src.toString('base64')}`
-    )}`;
+    } ${JSON.stringify(encodedData)}`;
   }
 
   // Normalize the fallback.

src/index.js

@@ -5,6 +5,30 @@
       "description": "Enables/Disables transformation target file into base64 URIs (https://github.com/webpack-contrib/url-loader#limit).",
       "type": ["boolean", "number", "string"]
     },
+    "encoding": {
+      "description": "Specify the encoding which the file will be in-lined with.",
+      "oneOf": [
+        {
+          "enum": [
+            "utf8",
+            "utf16le",
+            "latin1",
+            "base64",
+            "hex",
+            "ascii",
+            "binary",
+            "ucs2"
+          ]
+        },
+        {
+          "type": "boolean"
+        }
+      ]
+    },
+    "generator": {
+      "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"