Skip to content

Commit

Permalink
added details
Browse files Browse the repository at this point in the history
  • Loading branch information
sullenor committed Mar 8, 2017
1 parent c8bfa48 commit 54c574a
Show file tree
Hide file tree
Showing 2 changed files with 60 additions and 8 deletions.
66 changes: 58 additions & 8 deletions readme.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
postcss-modules-resolve-imports
===============================
CSS Modules: Resolve Imports
============================


Transforms:
Expand Down Expand Up @@ -27,35 +27,85 @@ into:
}
```

Should be used after [postcss-modules-scope](https://github.com/css-modules/postcss-modules-scope).


## Options

`explicitExports` `boolean`
`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,

```javascript
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:

```javascript
{dash: path.resolve(__dirname, 'lib/dash')}
alias: {
lib: path.resolve(__dirname, 'lib'),
},
```

Now, instead of using relative paths when composing:

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

you can use the alias:

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


`resolve.extensions` `array`

Automaticaly check files with the provided extensions.

```javascript
['.css']
```

Allows you to omit file extensions while using compose:

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


`resolve.modules` `array`

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

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


## Reference Guides

- Interoperable CSS: https://github.com/css-modules/icss
- https://en.wikipedia.org/wiki/Topological_sorting
- https://nodejs.org/dist/latest-v6.x/docs/api/modules.html#modules_all_together
- http://api.postcss.org/AtRule.html#walkRules
- NodeJS modules resolving mechanism: https://nodejs.org/dist/latest-v6.x/docs/api/modules.html#modules_all_together


## License

> The MIT License
2 changes: 2 additions & 0 deletions sync.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@
* Containers are iterated with .walk* methods.
* Rules are actually selectors.
* Decls are actually css rules (keys prop, value).
*
* @see http://api.postcss.org/AtRule.html#walkRules
*/

const {plugin} = require('postcss');
Expand Down

0 comments on commit 54c574a

Please sign in to comment.