JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • 0
  • Score
    100M100P100Q48757F
  • License MIT

Automatically font stacks into font-family declarations

Package Exports

  • postcss-fontstack-auto
  • postcss-fontstack-auto/dist/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 (postcss-fontstack-auto) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

postcss-fontstack-auto

PostCSS plugin to expand font names to web-safe stack automatically.

Originally postcss-fontstack force to use fontstack().

.some {
  font-family: Arial;
  font: 30px/20px Courier;
  /* will be unchanged */
  font-family: Arial, Roboto, sans-serif;
}

will be

.some {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font: 30px/20px "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
  /* unchanged */
  font-family: Arial, Roboto, sans-serif;
}

Use postcss-minify-font-values for minifying.

Usage

Expand rules with your own font names and stacks.

require('postcss-fontstack-auto')({
  fontstack: [
    'YourScript': ['Arial', 'Helvetica Neue', 'Helvetica', 'sans-serif']
  ]
})

Options

fontstack Array. Key is font name. Value is Array of font names (if it have whitespace in name then it will be in double quotes).

Every word in font name should start with uppercased letter, e.g. Unique-Light Sans.