https://github.com/csstools/create-postcss-plugin
Quickly create new PostCSS plugins
https://github.com/csstools/create-postcss-plugin
Last synced: 11 months ago
JSON representation
Quickly create new PostCSS plugins
- Host: GitHub
- URL: https://github.com/csstools/create-postcss-plugin
- Owner: csstools
- Archived: true
- Created: 2015-07-07T12:37:58.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2019-11-09T12:33:30.000Z (over 6 years ago)
- Last Synced: 2025-04-25T05:06:17.042Z (11 months ago)
- Language: JavaScript
- Homepage:
- Size: 28.3 KB
- Stars: 15
- Watchers: 4
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# Create PostCSS Plugin [
][PostCSS]
[![NPM Version][npm-img]][npm-url]
[![Build Status][cli-img]][cli-url]
[![Gitter Chat][git-img]][git-url]
[Create PostCSS Plugin] lets you quickly create new [PostCSS] plugins with
documentation, tests, and built-in compiling for supported Node environments.
```sh
npm init postcss-plugin YOUR_DESTINATION
```
Alternatively, you can use the `npx` command:
```sh
npx create-postcss-plugin YOUR_DESTINATION
```
After completing the instructions, write your plugin to `src/index.js` and
update `README.md` with further details outlining your plugin functionality.
## Usage
By default, **Create PostCSS Plugin** provides you the following prompts:
```
Plugin Name: [TITLE]
Keywords: [KEYWORDS]
```
Once completed, you will see the following message:
```
Success! Created PostCSS [TITLE] at [DIRECTORY]
We suggest that you begin by typing:
cd [DIRECTORY]
npm test
Happy PostCSS-ing!
```
To skip all prompts, you must at least provide a title and keywords.
```sh
create-postcss-plugin --title Stuff --keywords comma,separated,keywords
```
If your system cannot access git user information from `.gitconfig`, you must
also provide an author, email, and user.
```sh
create-postcss-plugin --title Stuff --author "Cee S Esse" --email "postcss@postcss.org" --user ceesesse --keywords comma,separated,keywords
```
## Options
You can pass options into postcss-plugin to automate plugin creation.
### to
The `to` argument defines the destination of the new project. The first
undefined argument will also determine this value.
```sh
npm init postcss-plugin --to path/to/plugin
```
### title
The `title` argument defines the formal name of the project.
```sh
npm init postcss-plugin --title Stuff
```
```sh
npm init postcss-plugin --title "Awesome Blossom"
```
### id
The `id` argument defines the id used by the project package.json and
repository.
```sh
npm init postcss-plugin --id awes-blos
```
### desc
The `desc` or `description` argument defines the description used by the
project README.md and package.json.
```sh
# becomes "Use exciting new functions" and "Awesome Blossom lets you create new functions in CSS."
npm init postcss-plugin --desc "use exciting new functions"
```
```sh
# becomes "Use exciting new functions" and "Awesome Blossom lets you create new functions in CSS."
npm init postcss-plugin --description "use exciting new functions"
```
### author
The `author` argument defines the author used by the project package.json.
```sh
npm init postcss-plugin --author "Cee S Esse"
```
### email
The `email` argument defines the email used by the project package.json.
```sh
npm init postcss-plugin --email "postcss@postcss.org"
```
### user
The `user` argument defines the user or organization hosting the project.
```sh
npm init postcss-plugin --user "postcss"
```
### keywords
The `keywords` argument defines the keywords used by the project package.json.
```sh
npm init postcss-plugin --keywords "awesome,blossom"
```
### no-install
The `no-install` argument instructs the project to not automatically install
dependencies.
```sh
npm init postcss-plugin --no-install
```
[Create PostCSS Plugin]: https://github.com/csstools/create-postcss-plugin
[PostCSS]: https://github.com/postcss/postcss
[cli-img]: https://img.shields.io/travis/csstools/create-postcss-plugin/master.svg
[cli-url]: https://travis-ci.org/csstools/create-postcss-plugin
[git-img]: https://img.shields.io/badge/support-chat-blue.svg
[git-url]: https://gitter.im/postcss/postcss
[npm-img]: https://img.shields.io/npm/v/create-postcss-plugin.svg
[npm-url]: https://www.npmjs.com/package/create-postcss-plugin