feat: support publicPath option

README.md

@@ -12,19 +12,21 @@ Webpack loader for creating SVG sprites.
 - [Why it's cool](#why-its-cool)
 - [Installation](#installation)
 - [Configuration](#configuration)
-  - [`symbolId`](#symbolid-default-name)
-  - [`esModule`](#esmodule-default-true-autoconfigured)
+  - [`symbolId`](#symbol-id)
+  - [`symbolRegExp`](#symbol-regexp)
+  - [`esModule`](#es-module)
   - [Runtime configuration](#runtime-configuration)
-    - [`spriteModule`](#spritemodule-autoconfigured)
-    - [`symbolModule`](#symbolmodule-autoconfigured)
-    - [`runtimeGenerator`](#runtimegenerator-default-generator)
-    - [`runtimeCompat`](#runtimecompat-default-false-deprecated)
-    - [`runtimeOptions`](#runtimeoptions)
+    - [`spriteModule`](#sprite-module)
+    - [`symbolModule`](#symbol-module)
+    - [`runtimeGenerator`](#runtime-generator)
+    - [`runtimeCompat`](#runtime-compat) (deprecated)
+    - [`runtimeOptions`](#runtime-options)
   - [Extract configuration](#extract-configuration)
-    - [`extract`](#extract-default-false-autoconfigured)
-    - [`spriteFilename`](#spritefilename-default-spritesvg)
-    - [plain sprite](#plain-sprite)
-    - [sprite attributes](#sprite-attributes)
+    - [`extract`](#extract)
+    - [`spriteFilename`](#sprite-filename)
+    - [`publicPath`](#public-path)
+    - [`plainSprite`](#plain-sprite)
+    - [`spriteAttrs`](#sprite-attrs)
 - [Examples](#examples)
 - [Contributing guidelines](#contributing-guidelines)
 - [License](#license)
@@ -84,15 +86,17 @@ yarn add svg-sprite-loader -D
 }
 ```
 
-
+<a id="symbol-id"></a>
 ### `symbolId` (default `[name]`)
 
 How `<symbol>` `id` attribute should be named. All patterns from [loader-utils#interpolateName](/~https://github.com/webpack/loader-utils#interpolatename)
 are supported.
 
+<a id="symbol-regexp"></a>
 ### `symbolRegExp` (default `''`)
 Passed to the symbolId interpolator to support the [N] pattern in the loader-utils name interpolator
 
+<a id="es-module"></a>
 ### `esModule` (default `true`, autoconfigured)
 
 Generated export format:
@@ -121,6 +125,7 @@ const rendered = `
 When browser event `DOMContentLoaded` is fired, sprite will be automatically rendered and injected in the `document.body`.
 If custom behaviour is needed (e.g. a different mounting target) default sprite module could be overridden via `spriteModule` option. Check example below.
 
+<a id="sprite-module"></a>
 ### `spriteModule` (autoconfigured)
 
 Path to sprite module that will be compiled and executed at runtime.
@@ -147,21 +152,25 @@ It's highly recommended to extend default sprite classes:
 - [for browser-specific env](/~https://github.com/kisenka/svg-baker/blob/master/packages/svg-baker-runtime/src/browser-sprite.js)
 - [for isomorphic env](/~https://github.com/kisenka/svg-baker/blob/master/packages/svg-baker-runtime/src/sprite.js)
 
+<a id="symbol-module"></a>
 ### `symbolModule` (autoconfigured)
 
 Same as `spriteModule`, but for sprite symbol. By default also depends on `target` webpack config option:
 - `svg-sprite-loader/runtime/browser-symbol.build` for 'web' target.
 - `svg-sprite-loader/runtime/symbol.build` for other targets.
 
+<a id="runtime-generator"></a>
 ### `runtimeGenerator` ([default generator](/~https://github.com/kisenka/svg-sprite-loader/blob/master/lib/runtime-generator.js))
 
 Path to node.js script that generates client runtime.
 Use this option if you need to produce your own runtime, e.g. React component configured with imported symbol. [Example](/~https://github.com/kisenka/svg-sprite-loader/tree/master/examples/custom-runtime-generator).
 
+<a id="runtime-compat"></a>
 ### `runtimeCompat` (default `false`, deprecated)
 
 Should runtime be compatible with earlier v0.x loader versions. This option will be removed in the next major version release.
 
+<a id="runtime-options"></a>
 ### `runtimeOptions`
 
 Arbitrary data passed to runtime generator. Reserved for future use when other runtime generators will be created.
@@ -183,11 +192,13 @@ const SpriteLoaderPlugin = require('svg-sprite-loader/plugin');
 }
 ```
 
+<a id="extract"></a>
 ### `extract` (default `false`, autoconfigured)
 
 Switches loader to the extract mode.
 Enabled automatically for images imported from css/scss/sass/less/styl/html files.
 
+<a id="sprite-filename"></a>
 ### `spriteFilename` (type `string|Function<string>`,default `sprite.svg`)
 
 Filename of extracted sprite. Multiple sprites can be generated by specifying different loader rules restricted with `include` option or
@@ -207,17 +218,18 @@ by providing custom function which recieves SVG file absolute path, e.g.:
 `[hash]` in sprite filename will be replaced by it's content hash.
 It is also possible to generate sprite for each chunk by using `[chunkname]` pattern in spriteFilename option. This is experimental feature, use it with caution!
 
-### `outputPath` (type: `string`, default: `__webpack_public_path__`)
+<a id="public-path"></a>
+### `publicPath` (type: `string`, default: `__webpack_public_path__`)
 
-Custom output path for sprite svg.
+Custom public path for sprite file.
 
 ```js
 {
   test: /\.svg$/,
   loader: 'svg-sprite-loader',
   options: {
     extract: true,
-    outputPath: '/'
+    publicPath: '/'
   }
 }
 ```
@@ -235,7 +247,7 @@ You can render plain sprite in extract mode without styles and usages. Pass `pla
 }
 ```
 
-<a id="sprite-attributes"></a>
+<a id="sprite-attrs"></a>
 ### Sprite attributes
 
 Sprite `<svg>` tag attributes can be specified via `spriteAttrs` plugin option:

lib/runtime-generator.js

@@ -17,12 +17,12 @@ const {
  */
 function runtimeGenerator(params) {
   const { symbol, config, context } = params;
-  const { extract, esModule, spriteModule, symbolModule, runtimeCompat, outputPath } = config;
+  const { extract, esModule, spriteModule, symbolModule, runtimeCompat, publicPath } = config;
   let runtime;
 
   if (extract) {
     const spritePlaceholder = generateSpritePlaceholder(symbol.request.file);
-    const path = stringify(outputPath) || '__webpack_public_path__';
+    const path = stringify(publicPath) || '__webpack_public_path__';
     const data = `{
       id: ${stringify(symbol.useId)},
       viewBox: ${stringify(symbol.viewBox)},