1 | # [svgo](https://github.com/svg/svgo) loader for [webpack](https://github.com/webpack/webpack)
|
2 |
|
3 | ## Install
|
4 |
|
5 | ```
|
6 | $ npm install svgo-loader --save-dev
|
7 | ```
|
8 |
|
9 | ## Usage
|
10 |
|
11 | [Documentation: Using loaders](http://webpack.github.io/docs/using-loaders.html)
|
12 |
|
13 | Svgo-loader just passes config
|
14 | to the [svgo](https://github.com/svg/svgo) library.
|
15 |
|
16 | There is two ways of loading svgo configuration.
|
17 | You can pass it as a JSON string after loader name, like this:
|
18 |
|
19 | ``` javascript
|
20 | // webpack.config.js
|
21 |
|
22 | var svgoConfig = JSON.stringify({
|
23 | plugins: [
|
24 | {removeTitle: true},
|
25 | {convertColors: {shorthex: false}},
|
26 | {convertPathData: false}
|
27 | ]
|
28 | });
|
29 |
|
30 | module.exports = {
|
31 | ...
|
32 | module: {
|
33 | loaders: [
|
34 | {
|
35 | test: /.*\.svg$/,
|
36 | loaders: [
|
37 | 'file-loader',
|
38 | 'svgo-loader?' + svgoConfig
|
39 | ]
|
40 | }
|
41 | ]
|
42 | }
|
43 | }
|
44 | ```
|
45 |
|
46 | Or you can save svgo config in your main webpack config object,
|
47 | and then specify name of the property in the loader query string:
|
48 |
|
49 | ``` javascript
|
50 | // webpack.config.js
|
51 |
|
52 | module.exports = {
|
53 | ...
|
54 | module: {
|
55 | loaders: [
|
56 | {
|
57 | test: /.*\.svg$/,
|
58 | loaders: [
|
59 | 'file-loader',
|
60 | 'svgo-loader?useConfig=svgoConfig1'
|
61 | ]
|
62 | }
|
63 | ]
|
64 | },
|
65 | svgoConfig1: {
|
66 | plugins: [
|
67 | {removeTitle: true},
|
68 | {convertColors: {shorthex: false}},
|
69 | {convertPathData: false}
|
70 | ]
|
71 | }
|
72 | }
|
73 | ```
|