https://github.com/andrey-hohlov/posthtml-inline-svg

PostHTML plugin that inline svg icons in HTML
https://github.com/andrey-hohlov/posthtml-inline-svg

posthtml posthtml-plugin svg-icons

Last synced: about 1 month ago
JSON representation

PostHTML plugin that inline svg icons in HTML

• Host: GitHub
• URL: https://github.com/andrey-hohlov/posthtml-inline-svg
• Owner: andrey-hohlov
• Created: 2019-06-14T05:44:55.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2024-06-11T14:18:16.000Z (5 months ago)
• Last Synced: 2024-09-22T01:45:42.073Z (about 2 months ago)
• Topics: posthtml, posthtml-plugin, svg-icons
• Language: JavaScript
• Homepage:
• Size: 144 KB
• Stars: 10
• Watchers: 1
• Forks: 3
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# posthtml-inline-svg

[PostHTML](https://github.com/posthtml/posthtml) plugin that inline svg icons in HTML. Like GitHub [does](https://github.blog/2016-02-22-delivering-octicons-with-svg/) with Octicons.

### Before

```html

```

### After

```html

  

```

## Install

```bash

npm i -D posthtml posthtml-inline-svg

```

## Usage

```js

const path = require('path')

const fs = require('fs')

const posthtml = require('posthtml');

const inlineSVG = require('posthtml-inline-svg');

posthtml(inlineSVG({

  cwd: path.resolve('src'),

  tag: 'icon',

  attr: 'src',

 }))

  .process(fs.readFileSync('index.html', 'utf8'))

  .then((result) => console.log(result.html));

```

## Options

|Option|Default|Description|

|:-:|:--|:--|

| **cwd** | `process.cwd()` | Path icon source related to |

| **tag** | `icon` | HTML-tag to process |

| **attr** | `src` | Attribute to get icon path |

| **comment** | `false` | Render HTML comment with icon source before icon markup |

| **svgo** `since 0.2.0` | `null` | Custom [SVGO](https://github.com/svg/svgo) config |