Commit 2137ed04 authored by Philipp Nowinski's avatar Philipp Nowinski

Merge branch 'readme-fix' into 'master'

Readme fixes

I've fixed some typos, and corrected the usage example to be inside a gulp task.

See merge request !1
parents fc3e1505 458d1e0d
# gulp-inline-svg # gulp-inline-svg
> inline-svg plugin for [gulp](https://github.com/wearefractal/gulp) > inline-svg plugin for [gulp](https://github.com/wearefractal/gulp)
This plugin takes a couple of SVG files and provides them inside a Sass mixin as inlined background-images. By doing so, you can use them without having to touch you Markup. This plugin takes a couple of SVG files and provides them inside a Sass mixin as inlined background-images. By doing so, you can use them without having to touch your markup.
## Compatibility ## Compatibility
The inlined SVG gets URL encoded, so it is save to use starting with IE9. The inlined SVG gets URL encoded, so it is save to use starting with IE9.
...@@ -11,7 +11,7 @@ The generated mixin contains width and height values for each SVG. Those values ...@@ -11,7 +11,7 @@ The generated mixin contains width and height values for each SVG. Those values
## Usage ## Usage
First, install `gulp-inline-svg as a development dependency: First, install `gulp-inline-svg` as a development dependency:
```shell ```shell
npm install --save-dev gulp-inline-svg npm install --save-dev gulp-inline-svg
...@@ -23,10 +23,12 @@ Then, add it to your `gulpfile.js`. I'd recommend to use it in conjunction with ...@@ -23,10 +23,12 @@ Then, add it to your `gulpfile.js`. I'd recommend to use it in conjunction with
var inlineSvg = require("gulp-inline-svg"), var inlineSvg = require("gulp-inline-svg"),
svgMin = require('gulp-svgmin'); svgMin = require('gulp-svgmin');
gulp.src("images/svgs/**/*.svg") gulp.task('inline-svg', function() {
.pipe(svgMin()) return gulp.src("images/svgs/**/*.svg")
.pipe(inlineSvg()) .pipe(svgMin())
.pipe(gulp.dest("sass")); .pipe(inlineSvg())
.pipe(gulp.dest("sass"));
});
``` ```
This will create a _svg.scss file inside your 'sass' folder. This will create a _svg.scss file inside your 'sass' folder.
...@@ -60,7 +62,7 @@ The _svg.scss file will provide you with the following mixins and functions: ...@@ -60,7 +62,7 @@ The _svg.scss file will provide you with the following mixins and functions:
``` ```
## Configuration ## Configuration
If you want wo customize the default configuration, you can pass an options object to the task function: If you want to customize the default configuration, you can pass an options object to the task function:
```javascript ```javascript
gulp.src("images/svgs/**/*.svg") gulp.src("images/svgs/**/*.svg")
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment