Nucleus Powered Mitochondria
    Have ideas to improve npm?Join in the discussion! »

    nuxt-fontagon

    1.0.3 • Public • Published

    🐾 Nuxt-Fontagon

    npm version npm downloads Circle CI Codecov Standard JS License

    Easy convert SVG from nuxt to icon font. Try converting svg into font easily to make icon-font automatically. The Icon-Font generator Fontagon is available on the Nuxt module.

    Info

    🔔 This package has been renamed from nuxt-iconfont-generator to nuxt-fontagon

    Features

    √ Automatically convert svg to font file when building
    √ Based on the svg file name, create the CSS and Stylus, SASS, and LESS files as you want

    🔔 nuxt-fontagon uses Fontagon functionality as it is. See the Fontagon documentation

    Install

    ⚠️ If you are using Nuxt older than v2.9 you have to install module as a dependency (No --dev or --save-dev flags) and also use modules section in nuxt.config.js instead of buildModules.

    Install with npm:

    npm install nuxt-fontagon

    nuxt.config.js:

    module.exports = {
      buildModules: [
        'nuxt-fontagon'
      ],
      iconFont: {
        /* Fontagon options */
      }
    }

    Options

    files

    List of SVG files.

    🔔 The files option srcDir in Nuxt is root path.

    • Type: Array
    • Default: [srcDir/assets/**/*.svg]
    • required

    dist

    Directory for generated font files.

    🔔 The dist option srcDir in Nuxt is root path.

    • Type: String
    • Default: 'srcDir/assets/font'

    fontName

    Specify a font name and the default name for the font file.

    • Type: String
    • Default: 'fontagon-icons'

    style

    stylesheet file generation type.

    • Type: String
    • Default: 'all'
    • options: 'css', 'sass', 'less', 'stylus'

    styleTemplate

    Specify a custom style template.

    The '.hbs' extension is required because the custom template is compiled through handlebars.

    If the style is 'all', only one pre-processor template is specified in the styleTemplate, it is merged with the default option and processed.

    • Type: Object
    • Default:
    {
      "styleTemplate": {
          "css": "css.hbs",
          "sass": "sass.hbs",
          "less": "less.hbs",
          "stylus": "styl.hbs"
      }
    }

    classOptions

    Additional options for CSS templates, that extends default options.

    When 'baseClass' is set, it is specified by the default class name of the stylesheet, or 'classPrefix' as a sub class factor of the stylesheet.

    • Type: Object
    • Default:
    {
        "baseClass": "fontagon-icons",
        "classPrefix": "ft"
      }

    order

    Order of src values in font-face in CSS file.

    • Type: Array
    • Default: ['eot', 'woff2', 'woff', 'ttf', 'svg']

    rename

    Function that takes path of file and return name of icon.

    • Type: Function
    • Default: basename of file

    startCodepoint

    Starting codepoint. Defaults to beginning of unicode private area.

    • Type: Number
    • Default: 0xF101

    codepoints

    Specific codepoints for certain icons.
    Icons without codepoints will have codepoints incremented from startCodepoint skipping duplicates.

    • Type: Object
    • Default: {}

    formatOptions

    Specific per format arbitrary options to pass to the generator

    • Type: object
    • Default:
    {
      "svg": {
        "normalize": true,
        "fontHeight": 1000
      }
    }

    format and matching generator:


    writeFiles

    It is possible to not create files and get generated fonts in object to write them to files later.
    Also results object will have function generateCss([urls]) where urls is an object with future fonts urls.

    • Type: Boolean
    • Default: true

    License

    MIT License

    Copyright (c) Dev.DY

    Install

    npm i nuxt-fontagon

    DownloadsWeekly Downloads

    342

    Version

    1.0.3

    License

    MIT

    Unpacked Size

    9.73 kB

    Total Files

    6

    Last publish

    Collaborators

    • avatar