File tree Expand file tree Collapse file tree 1 file changed +31
-6
lines changed Expand file tree Collapse file tree 1 file changed +31
-6
lines changed Original file line number Diff line number Diff line change
1
+ # vue-svg-loader
2
+ A webpack loader that allows to use SVG files as Vue Components.
3
+
4
+ ## Installation
5
+ ` npm install --save-dev vue-svg-loader `
6
+
7
+ ## Configuration
1
8
``` js
2
9
{
3
10
test: / \. svg$ / ,
4
- loader: ' vue-svg-loader' ,
11
+ loader: ' vue-svg-loader' , // `vue-svg` for webpack 1.x
5
12
}
6
13
```
7
14
8
- ``` js
9
- import SomeIcon from ' ./assets/svg/some-icon.svg' ;
10
- ```
15
+ ## Example code
16
+
17
+ ``` html
18
+ <template >
19
+ <nav id =" menu" >
20
+ <a href =" ..." >
21
+ <SomeIcon class =" icon" />
22
+ Some page
23
+ </a >
24
+ </nav >
25
+ </template >
26
+
27
+ <script >
28
+ import SomeIcon from ' ./assets/some-icon.svg' ;
11
29
12
- ``` vue
13
- <SomeIcon />
30
+ export default {
31
+ name: ' menu' ,
32
+ components: {
33
+ SomeIcon,
34
+ },
35
+ };
36
+ </script >
14
37
```
38
+ ---
39
+ * The idea behind this was inspired by [ react-svg-loader] ( https://github.com/boopathi/react-svg-loader ) * .
You can’t perform that action at this time.
0 commit comments