diff --git a/README.md b/README.md index 41a9eb1..2a50198 100644 --- a/README.md +++ b/README.md @@ -26,6 +26,7 @@ Webpack loader for creating SVG sprites. - [`extract`](#extract) - [`spriteFilename`](#sprite-filename) - [`publicPath`](#public-path) + - [`outputPath`](#output-path) - [`plainSprite`](#plain-sprite) - [`spriteAttrs`](#sprite-attrs) - [Examples](#examples) @@ -241,6 +242,25 @@ Custom public path for sprite file. } ``` + +### `outputPath` (type: `string`, default: null`) + +Custom output path for sprite file. +By default it will use `publicPath`. +This param is useful if you want to store sprite is a directory with a custom http access. + +```js +{ + test: /\.svg$/, + loader: 'svg-sprite-loader', + options: { + extract: true, + outputPath: 'custom-dir/sprites/' + publicPath: 'sprites/' + } +} +``` + ### Plain sprite diff --git a/lib/plugin.js b/lib/plugin.js index a79898a..f820150 100644 --- a/lib/plugin.js +++ b/lib/plugin.js @@ -63,6 +63,11 @@ class SVGSpritePlugin { apply(compiler) { this.rules = getMatchedRule(compiler); + const path = this.rules.outputPath ? this.rules.outputPath : this.rules.publicPath; + this.filenamePrefix = path + ? path.replace(/^\//, '') + : ''; + if (compiler.hooks) { compiler.hooks .thisCompilation @@ -162,11 +167,8 @@ class SVGSpritePlugin { }) .then((sprite) => { const content = sprite.render(); - const filenamePrefix = this.rules.publicPath - ? this.rules.publicPath.replace(/^\//, '') - : ''; - compilation.assets[`${filenamePrefix}${filename}`] = { + compilation.assets[`${this.filenamePrefix}${filename}`] = { source() { return content; }, size() { return content.length; } }; @@ -209,11 +211,9 @@ class SVGSpritePlugin { beforeHtmlGeneration(compilation) { const itemsBySprite = this.map.groupItemsBySpriteFilename(); - const filenamePrefix = this.rules.publicPath - ? this.rules.publicPath.replace(/^\//, '') - : ''; + const sprites = Object.keys(itemsBySprite).reduce((acc, filename) => { - acc[filenamePrefix + filename] = compilation.assets[filenamePrefix + filename].source(); + acc[this.filenamePrefix + filename] = compilation.assets[this.filenamePrefix + filename].source(); return acc; }, {});