JSPM

css-font-face-src

2.0.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 20705
  • Score
    100M100P100Q197647F
  • License BSD-2-Clause

A CSS @font-face src property value parser

Package Exports

  • css-font-face-src
  • css-font-face-src/dist/ts/index.js
  • css-font-face-src/dist/umd/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (css-font-face-src) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

CSS @font-face rule src field parser – css-font-face-src

NPM version

A CSS @font-face src property value parser.

Basically it provides two operations:

  • parse: To convert a CSS property string to an array of easily readable objects. Each object either describes a local font (referenced using its family name) or a remote font (referenced using its URL).
  • serialize: To convert an object array back to a CSS property string.

Examples

JavaScript verison (CJS, using require)

Parse

const parser = require('css-font-face-src');

console.log(parser.parse('local("The Font"), url("font.otf") format("opentype"), url("font.woff"), local("Another Font")'));

will return:

[
    { local: 'The Font' },
    { url: 'font.otf', format: 'opentype' },
    { url: 'font.woff' },
    { local: 'Another Font' }
]

Serialize

const parser = require('css-font-face-src');

console.log(
    parser.serialize([
        { local: 'The Font' },
        { url: 'font.otf', format: 'opentype' },
        { url: 'font.woff' },
        { local: 'Another Font' }
    ])
);

will return:

'local("The Font"), url("font.otf") format("opentype"), url("font.woff"), local("Another Font")'

JavaScript version (ESM, using import)

Parse

import { parse } from 'css-font-face-src';

console.log(parse('local("The Font"), url("font.otf") format("opentype"), url("font.woff"), local("Another Font")'));

will return:

[
    { local: 'The Font' },
    { url: 'font.otf', format: 'opentype' },
    { url: 'font.woff' },
    { local: 'Another Font' }
]

Serialize

import { serialize } from 'css-font-face-src';

console.log(
    serialize([
        { local: 'The Font' },
        { url: 'font.otf', format: 'opentype' },
        { url: 'font.woff' },
        { local: 'Another Font' }
    ])
);

will return:

'local("The Font"), url("font.otf") format("opentype"), url("font.woff"), local("Another Font")'

TypeScript version

Parse

import { parse } from 'css-font-face-src';

console.log(parse('local("The Font"), url("font.otf") format("opentype"), url("font.woff"), local("Another Font")'));

will return:

[
    { local: 'The Font' },
    { url: 'font.otf', format: 'opentype' },
    { url: 'font.woff' },
    { local: 'Another Font' }
]

Serialize

import { serialize, FontFaceSrcItem } from 'css-font-face-src';

console.log(
    serialize([
        { local: 'The Font' },
        { url: 'font.otf', format: 'opentype' },
        { url: 'font.woff' },
        { local: 'Another Font' }
    ] as FontFaceSrcItem[])
);

will return:

'local("The Font"), url("font.otf") format("opentype"), url("font.woff"), local("Another Font")'

Build status

Build Status

Author

Christoph Burgmer. Licensed under BSD-2-Clause. Reach out on Twitter.