https://github.com/gaven/nuxt-svg-sprite-module

A quick and dirty way to inline svg sprites in your Nuxt app.
https://github.com/gaven/nuxt-svg-sprite-module

nuxt nuxt-module sprites vue

Last synced: about 2 months ago
JSON representation

A quick and dirty way to inline svg sprites in your Nuxt app.

• Host: GitHub
• URL: https://github.com/gaven/nuxt-svg-sprite-module
• Owner: gaven
• Created: 2018-12-03T23:32:17.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2022-12-08T22:05:39.000Z (almost 2 years ago)
• Last Synced: 2024-07-19T23:35:08.178Z (2 months ago)
• Topics: nuxt, nuxt-module, sprites, vue
• Language: JavaScript
• Size: 400 KB
• Stars: 22
• Watchers: 1
• Forks: 0
• Open Issues: 8
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# nuxt-svg-sprite-module

> A quick and dirty way to inline svg sprites in your Nuxt app.

## Install

```sh

$ yarn add nuxt-svg-sprite-module

$ npm install nuxt-svg-sprite-module --save

```

## Configure

In `nuxt.config.js`

```js

modules: [

  [

    "nuxt-svg-sprite-module",

    {

      directory: "~/assets/icons",

      // Optional template location: defaults to __dirname + /app.html

      templateLocation: "src/app.html",

      options: {

        // Configuration options:

        // https://github.com/jkphl/svg-sprite#configuration-basics

      },

    },

  ],

];

```

## Usage

This module finds svgs in your specified directory and inlines them in Nuxt's [app template](https://nuxtjs.org/guide/views/#app-template). You can pass [svg-sprite options](https://github.com/jkphl/svg-sprite#configuration-basics) to be merged with the the default configuration options.

By default, icons are prefixed with the word `icon`.

```html

  

```

In order to tell this module where to inline your sprite you need to include a comment within your `app.html` file. Idealy this comment would proceed the opening `` tag. If an `app.html` file does not exist, one will be generated in its absence.

```html

```

## Contributing

Pull requests and stars are always welcome. For bugs and feature requests, [please create an issue](https://github.com/gaven/nuxt-svg-sprite-module/issues/new)

## Author

#### Gaven Heim

- [github/gaven](https://github.com/gaven)

- [twitter/gavenheim](https://twitter.com/gavenheim)