Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dimitrinicolas/postcss-import-ext-glob
A PostCSS plugin to extend postcss-import path resolver to allow glob usage as path, e.g. @import-glob "**/*.css";
https://github.com/dimitrinicolas/postcss-import-ext-glob
glob postcss postcss-import postcss-plugin
Last synced: 3 days ago
JSON representation
A PostCSS plugin to extend postcss-import path resolver to allow glob usage as path, e.g. @import-glob "**/*.css";
- Host: GitHub
- URL: https://github.com/dimitrinicolas/postcss-import-ext-glob
- Owner: dimitrinicolas
- License: mit
- Created: 2018-08-13T11:55:02.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2022-11-30T10:42:08.000Z (about 2 years ago)
- Last Synced: 2025-02-10T17:45:28.592Z (4 days ago)
- Topics: glob, postcss, postcss-import, postcss-plugin
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/postcss-import-ext-glob
- Size: 355 KB
- Stars: 37
- Watchers: 3
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# postcss-import-ext-glob [![Build Status][travis badge]][travis link] [![Coverage Status][coveralls badge]][coveralls link]
A [PostCSS][postcss] v8 plugin to extend [postcss-import][postcss-import] path
resolver to allow [glob][glob ref] usage as a path.
You must use this plugin along with [postcss-import][postcss-import], place
this plugin **before** `postcss-import`.
```pcss
@import-glob "components/**/*.css";
```
## Installation
```console
$ npm install --save-dev postcss postcss-import postcss-import-ext-glob
```
## Usage
```js
// PostCSS plugins
postcss([
require('postcss-import-ext-glob'),
require('postcss-import')
]);
```
Check out [PostCSS](https://github.com/postcss/postcss) docs for the complete
installation.
### Example
This plugin transform this:
```pcss
@import-glob "components/**/*.css";
```
into this:
```pcss
@import "components/form/input.css";
@import "components/form/submit.css";
/* etc */
```
Thereby, the plugin `postcss-import` can now import each file.
You can pass multiple globs in one:
```pcss
@import-glob "helpers/**/*.css", "components/**/*.css";
```
## Options
You can pass a `sort` option to this plugin with a value of "asc" or "desc":
```js
// Postcss plugins
postcss([
require('postcss-import-ext-glob')({
sort: 'desc'
}),
require('postcss-import')
]);
```
The sort order is by default ascending.
## Related
- [postcss-import][postcss-import] - PostCSS plugin to inline @import rules
content
- [fast-glob][fast-glob] - Module used for getting glob entries
- [fast-sort][fast-sort] - Module used for sorting glob entries
- [ava-postcss-tester][ava-postcss-tester] - Simply test your PostCSS plugin
with AVA
## License
This project is licensed under the [MIT license](LICENSE).
[travis badge]: https://travis-ci.org/dimitrinicolas/postcss-import-ext-glob.svg?branch=master
[travis link]: https://travis-ci.org/dimitrinicolas/postcss-import-ext-glob
[coveralls badge]: https://coveralls.io/repos/github/dimitrinicolas/postcss-import-ext-glob/badge.svg?branch=master
[coveralls link]: https://coveralls.io/github/dimitrinicolas/postcss-import-ext-glob?branch=master
[postcss]: https://github.com/postcss/postcss
[postcss-import]: https://github.com/postcss/postcss-import
[fast-glob]: https://www.npmjs.com/package/fast-glob
[fast-sort]: https://www.npmjs.com/package/fast-sort
[ava-postcss-tester]: https://github.com/dimitrinicolas/ava-postcss-tester
[glob ref]: https://en.wikipedia.org/wiki/Glob_(programming)