postcss-modules-resolve-imports
Resolves ICSS imports
Last updated 3 years ago by sullenor .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install postcss-modules-resolve-imports 
SYNC missed versions from official npm registry.

CSS Modules: Resolve Imports

Transforms:

:import("library/button.css") {
  i__imported_button_0: button;
}
:export {
  continueButton: _source_continueButton i__imported_button_0;
}
._source_continueButton {
  color: green;
}

into:

:export {
  continueButton: _source_continueButton _button_button
}
._button_button {
  /*common button styles*/
}
._source_continueButton {
  color: green
}

Note: should be used after postcss-modules-extract-imports and postcss-modules-scope.

The postcss-moduels-resolve-imports plugin also fixes @import and url() paths (which doesn't start from /) for the included modules from the different folders.

Options

icssExports boolean

Adds the :export declaration to the resulting css. In case you need the JavaScript object with tokens, you may obtain it by accessing the lazyResult.root.exports property. For example,

const lazyResult = postcss([...plugins]).process(cssString, {from: filepath});
const tokens = lazyResult.root.exports;

resolve object

Configure how modules should be resolved.

resolve.alias object

Create an aliases for the modules paths. For example, create an alias for the lib directory with common modules:

alias: {
  lib: path.resolve(__dirname, 'lib'),
},

Now, instead of using relative paths when composing:

.button {
  composes: normal from '../../lib/button.css';
}

you can use the alias:

.button {
  composes: normal from 'lib/button.css';
}

resolve.extensions array

Automaticaly check files with the provided extensions.

['.css']

Allows you to omit file extensions while using compose:

.button {
  composes: normal from '../lib/button';
}

resolve.modules array

Provide additional directories to check the modules in. Should be absolute paths only.

[path.resolve(__dirname, 'lib')]

resolve.mainFile string

Specifies the default filename to be used while resolving directories. Default: index.css.

resolve.preserveSymlinks boolean

Wether to resolve symlinks in paths. Defaults to nodejs behaviour: false, (parsed from --preserve-symlinks or environment variable PRESERVE_SYMLINKS).

Reference Guides

License

The MIT License

Current Tags

  • 1.3.0                                ...           latest (3 years ago)
  • 1.3.0                                ...           next (3 years ago)

7 Versions

  • 1.3.0                                ...           3 years ago
  • 1.2.1                                ...           3 years ago
  • 1.2.0                                ...           3 years ago
  • 1.1.2                                ...           3 years ago
  • 1.1.1                                ...           4 years ago
  • 1.1.0                                ...           4 years ago
  • 1.0.0                                ...           4 years ago

Copyright 2014 - 2016 © taobao.org |