https://github.com/bart-jaskulski/eleventy-postcss-extension

Add CSS processing with PostCSS to your Eleventy build.
https://github.com/bart-jaskulski/eleventy-postcss-extension

css eleventy eleventy-plugin postcss

Last synced: 3 months ago
JSON representation

Add CSS processing with PostCSS to your Eleventy build.

• Host: GitHub
• URL: https://github.com/bart-jaskulski/eleventy-postcss-extension
• Owner: bart-jaskulski
• Created: 2021-11-18T10:44:04.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2022-09-29T07:03:39.000Z (over 2 years ago)
• Last Synced: 2024-10-10T13:08:37.682Z (4 months ago)
• Topics: css, eleventy, eleventy-plugin, postcss
• Language: JavaScript
• Homepage:
• Size: 5.86 KB
• Stars: 7
• Watchers: 1
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# Eleventy plugin for processing CSS files

Adds CSS files to build pipeline with PostCSS processing. Include `postcss.config.js` in root folder of your project and start transforming CSS files without additional Eleventy setup.

## Installation

This plugin requires Eleventy 1.0.0.

```sh

npm install eleventy-postcss-extension

```

## Usage

```js

const pluginCSS = require("eleventy-postcss-extension");

module.exports = function(eleventyConfig) {

  eleventyConfig.addPlugin(pluginCSS);

};

```

Process your `*.css` files from your input directory. Any files living in your includes directory are by default available to import, not written to your output directory. This is achieved with using `postcss-import` by default when processing your CSS, which means you rather shouldn't explicitly enable this in your config (but you can). You can import your CSS as :

```css

@import 'vendor/reset.css';

/* import from `node_modules` also works */

@import 'tailwindcss/utilities';

```