postcss-load-options
Autoload Options for PostCSS
Last updated 5 years ago by michael-ciniawsky .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install postcss-load-options 
SYNC missed versions from official npm registry.

npm node deps tests coverage code style chat

<img width="100" height="100" title="Load Options" src="https://michael-ciniawsky.github.io/postcss-load-options/logo.svg"

Load Options

Install

npm i -D postcss-load-options

Usage

package.json

Create postcss section in your projects package.json.

App
  |– client
  |– public
  |
  |- package.json
{
  "dependencies": {
    "sugarss": "0.2.0"
  },
  "postcss": {
    "parser": "sugarss",
    "map": false,
    "from": "path/to/src/file.css",
    "to": "path/to/dest/file.css"
  }
}

.postcssrc

Create a .postcssrc file.

App
  |– client
  |– public
  |
  |- (.postcssrc|.postcssrc.json|.postcssrc.yaml)
  |- package.json

JSON

{
  "parser": "sugarss",
  "map": false,
  "from": "path/to/src/file.css",
  "to": "path/to/dest/file.css"
}

YAML

parser: sugarss
map: false
from: "/path/to/src.sss"
to: "/path/to/dest.css"

postcss.config.js or .postcssrc.js

You may need some JavaScript logic to generate your config. For this case you can use a file named postcss.config.js or .postcssrc.js.

App
  |– client
  |– public
  |
  |- (postcss.config.js|.postcssrc.js)
  |- package.json
module.exports = (ctx) => {
  return {
    parser: ctx.sugar ? 'sugarss' : false,
    map: ctx.env === 'development' ? ctx.map || false,
    from: 'path/to/src/file.css',
    to: 'path/to/dest/file.css'
  }
}

Options

parser:

'parser': 'sugarss'

syntax:

'syntax': 'postcss-scss'

stringifier:

'stringifier': 'midas'

map:

'map': 'inline'

from:

from: 'path/to/dest/file.css'

to:

to: 'path/to/dest/file.css'

Context

When using a function (postcss.config.js), it is possible to pass context to postcss-load-options, which will be evaluated before loading your options. By default ctx.env (process.env.NODE_ENV) and ctx.cwd (process.cwd()) are available.

Example

const { readFileSync } = require('fs')

const postcss = require('postcss')
const optionsrc = require('postcss-load-options')

const sss =  readFileSync('index.sss', 'utf8')

const ctx = { sugar: true,  map: 'inline' }

optionsrc(ctx).then((options) => {
  postcss()
    .process(sss, options)
    .then(({ css }) => console.log(css))
}))

Maintainers


Michael Ciniawsky

Current Tags

  • 1.2.0                                ...           latest (5 years ago)

11 Versions

  • 1.2.0                                ...           5 years ago
  • 1.1.0                                ...           5 years ago
  • 1.0.2                                ...           5 years ago
  • 1.0.1                                ...           5 years ago
  • 1.0.0                                ...           5 years ago
  • 1.0.0-alpha4                                ...           6 years ago
  • 1.0.0-alpha3                                ...           6 years ago
  • 1.0.0-alpha2                                ...           6 years ago
  • 1.0.2-alpha                                ...           6 years ago
  • 1.0.1-alpha                                ...           6 years ago
  • 1.0.0-alpha                                ...           6 years ago
Maintainers (1)
Downloads
Total 7,043,036
Today 151
This Week 32,321
This Month 96,936
Last Day 1,992
Last Week 33,897
Last Month 155,452
Dependencies (2)
Dev Dependencies (10)

Copyright 2014 - 2021 © npmmirror.com |