https://github.com/svelte-add/postcss

Add PostCSS to your Svelte project
https://github.com/svelte-add/postcss

cssnano postcss svelte svelte-add svelte-kit sveltekit vite

Last synced: about 1 month ago
JSON representation

Add PostCSS to your Svelte project

• Host: GitHub
• URL: https://github.com/svelte-add/postcss
• Owner: svelte-add
• License: mit
• Created: 2020-11-17T03:36:49.000Z (about 4 years ago)
• Default Branch: main
• Last Pushed: 2023-11-19T09:12:14.000Z (about 1 year ago)
• Last Synced: 2024-04-28T04:53:25.597Z (8 months ago)
• Topics: cssnano, postcss, svelte, svelte-add, svelte-kit, sveltekit, vite
• Language: JavaScript
• Homepage:
• Size: 90.8 KB
• Stars: 48
• Watchers: 4
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
🔺 Add PostCSS to Svelte


[![GitHub issues by-label](https://img.shields.io/github/issues/svelte-add/svelte-add/confirmed%20bug?color=%23DC2626)](https://github.com/svelte-add/svelte-add/issues?q=is%3Aopen+is%3Aissue+label%3A%22confirmed+bug%22)

[![GitHub issues by-label](https://img.shields.io/github/issues/svelte-add/svelte-add/support%20question?color=%23FACC15)](https://github.com/svelte-add/svelte-add/issues?q=is%3Aopen+is%3Aissue+label%3A%22support+question%22)

This is an adder for `svelte-add`; you should [read its `README`](https://github.com/svelte-add/svelte-add#readme) before continuing here.

## ➕ Adding PostCSS

This adder's codename is `postcss`, and can be used like so:

```sh

npx svelte-add@latest postcss

```

### 🏞 Supported environments

This adder supports SvelteKit and Vite-powered Svelte apps (all the environments `svelte-add` currently supports).

### ⚙️ Options

- `autoprefixer` (default `true`): whether or not to install and set up [Autoprefixer](https://github.com/postcss/autoprefixer).

```sh

npx svelte-add@latest postcss --postcss-autoprefixer

```

## 🛠 Using PostCSS

After the adder runs,

- You can write PostCSS syntax in the `style lang="postcss"` blocks in Svelte files.

- You can write PostCSS syntax in the `src/app.pcss` file.

  This is your global stylesheet because it will be active on every page of your site.

- You can install more [PostCSS plugins](https://github.com/postcss/postcss/blob/main/docs/plugins.md) and configure them in the `postcss.config.cjs` file.