Skip to content

A loader-agnostic CSS Modules implementation, based on PostCSS

Notifications You must be signed in to change notification settings

css-modules/css-modules-loader-core

Folders and files

NameName
Last commit message
Last commit date

Latest commit

3d83770 · May 22, 2017
Aug 4, 2015
Aug 19, 2016
Aug 15, 2016
May 29, 2015
Aug 4, 2015
Oct 31, 2016
Jun 7, 2015
May 22, 2017

Repository files navigation

CSS Module Loader Core

A loader-agnostic CSS Modules implementation, based on PostCSS

Build Status

API

import Core from 'css-modules-loader-core'
let core = new Core()

core.load( sourceString , sourcePath , pathFetcher ) =>
  Promise({ injectableSource, exportTokens })

Processes the input CSS sourceString, looking for dependencies such as @import or :import. Any localisation will happen by prefixing a sanitised version of sourcePath When dependencies are found, it will ask the pathFetcher for each dependency, resolve & inline any imports, and return the following object:

  • injectableSource: the final, merged CSS file without @import or :import statements
  • exportTokens: the mapping from local name to scoped name, as described in the file's :export block

These should map nicely to what your build-tool-specific loader needs to do its job.

new Core([plugins])

The default set of plugins is [postcss-modules-local-by-default, postcss-modules-extract-imports, postcss-modules-scope] (i.e. the CSS Modules specification). This can override which PostCSS plugins you wish to execute, e.g.

import Core from 'css-loader-core'
import autoprefixer from 'autoprefixer'
import colorFunctions from 'postcss-color-function'

// Don't run local-by-default, but use colorFunctions 
// beforehand and autoprefixer afterwards:
let core = new Core([
  colorFunctions, 
  core.plugins.extractImports, 
  core.plugins.scope, 
  autoprefixer("Last 2 Versions")
])

About

A loader-agnostic CSS Modules implementation, based on PostCSS

Resources

Stars

Watchers

Forks

Packages

No packages published