Meta tags:

Headings (most frequently used words):

plugins, plugin, postcss, config, file, built, in, options, order, custom, run, any, install, your, create, integrating, with, paths, passing, to, commonjs, support, required, older, format, yours, go, first, changing, the, no, for, automatic, compiling,

Text of the page (most frequently used words):
the (39), plugins (26), you (21), #postcss (21), #plugin (16), config (15), codekit (14), file (13), your (10), built (10), options (9), for (8), custom (8), and (7), can (7), project (6), mjs (6), pass (6), with (6), order (6), run (6), that (6), must (5), will (4), any (4), from (4), but (4), export (4), default (4), autoprefixer (4), list (4), object (4), this (4), install (4), commonjs (4), support (3), automatically (3), all (3), format (3), like (3), have (3), name (3), first (3), create (3), want (3), folder (3), set (3), css (2), sass (2), less (2), stylus (2), specify (2), use (2), short (2), option1 (2), value (2), option2 (2), true (2), second (2), control (2), adding (2), empty (2), not (2), need (2), its (2), both (2), simply (2), add (2), should (2), purgecss (2), has (2), modules (2), work (2), most (2), just (2), exactly (2), paths (2), named (2), root (2), projects (2), json (2), languages (2), frameworks (2), minifier (2), tools (2), browsers (2), steps (2), topics (2), privacy, policy, report, bug, email, follow, developer, twitter, made, san, diego, anytime, save, recompile, files, capture, changes, automatic, compiling, overwritten, values, change, using, still, copy, complete, over, final, where, changing, runs, above, before, yours, tailwindcss, import, several, integrating, prefer, avoid, write, understands, formats, older, module, include, they, industry, middle, giant, transition, everything, supports, newer, esm, approach, yet, require, required, configure, them, exact, otherplugin, those, associated, shown, below, passing, long, installed, don, supply, path, foo, someplugin, already, might, choose, well, package, places, dependencies, node_modules, within, open, area, then, search, packages, here, how, popular, ones, are, into, configuration, lots, watch, screencast, faq, upgrading, read, only, mode, more, coda, sublime, text, atom, nova, editor, scripting, team, workflows, environment, variables, hooks, advanced, eslint, syntax, checkers, jeet, nib, susy, zurb, foundation, bitters, bourbon, bootstrap, tailwind, gif, svg, jpeg, png, webp, image, optimizers, markdown, kit, slim, haml, pug, typescript, coffeescript, javascript, bless, lightningcss, html, cache, buster, rollup, bundler, terser, babel, transpiler, npm, other, license, recovery, troubleshooting, git, stuff, know, target, build, defaults, new, output, action, language, browser, sync, live, reload, getting, started, close, view, buy, now, menu, updates, about, help, videos, features,

Text of the page (random words):
codekit custom postcss plugins features videos help about updates menu buy now custom postcss plugins view topics close topics first steps getting started live reload browsers browser sync set language options set output paths action second steps defaults for new projects build your project set target browsers stuff to know codekit git troubleshooting license recovery postcss tools autoprefixer purgecss custom postcss plugins other tools npm babel js transpiler terser js minifier rollup js bundler cache buster html minifier lightningcss bless languages sass less stylus javascript coffeescript typescript pug haml slim kit markdown json image optimizers webp png jpeg svg gif frameworks codekit frameworks tailwind bootstrap bourbon bitters zurb foundation susy nib jeet syntax checkers eslint advanced hooks environment variables adding custom languages team workflows scripting codekit editor plugins nova atom sublime text coda 2 more read only mode upgrading from 2 0 faq run any postcss plugin 3 33 watch the screencast postcss has lots of plugins the most popular ones are built into codekit but you can run any plugin with any configuration you want here s how install your plugin first open the packages area then search for and install the plugin you want this places the plugin and its dependencies in the node_modules folder within your project so that codekit can run it for projects that already have a package json file you might choose to simply install from that file you can do that in codekit s ui as well create a config file create a file named postcss config mjs in your project s root folder it must be named exactly that and it must be in the root project folder add the custom plugin you want to run to the plugins object in the config file like this postcss config mjs export default plugins foo postcss plugin someplugin paths as long as the plugin is installed in your project you don t need to supply a path you can just list the plugin s name passing options to plugins to pass options to a plugin pass those in the object associated with the plugin s name as shown below for plugins with no options pass an empty object postcss config mjs export default plugins postcss plugin option1 value option2 true postcss otherplugin plugin order codekit will run your custom plugins exactly as you configure them in the exact order you specify commonjs support required the postcss config file is an es module but the plugins that you include must have support for commonjs i e they must work with require most plugins should just automatically work the industry is in the middle of a giant transition from commonjs to es modules and not everything supports the newer esm approach yet older config file format if you prefer to avoid es modules you can create a postcss config js file and write your config file in commonjs format codekit understands both formats integrating with built in plugins codekit has several postcss plugins built in autoprefixer css import purgecss tailwindcss yours go first codekit runs your custom plugins before all of the plugins in the list above changing the order you have complete control over the final order of all plugins both custom and built in simply add the name of the built in plugin to the list in your postcss config js file where it should run like this postcss config mjs export default plugins autoprefixer postcss short you do not need to install the built in plugins codekit will automatically use its copy no options for built in plugins if you re using the second config file format to pass options to plugins you can still control plugin order by adding built in plugins to the list but pass an empty object for the options like this postcss config mjs export default plugins autoprefixer postcss short option1 value option2 true any options you pass to a built in plugin in the config file will be overwritten with the values from codekit s ui you can specify the order of plugins but to change options for the built in plugins you must use the ui automatic compiling anytime you save the postcss config mjs file codekit will automatically recompile all css sass less and stylus files in your project to capture the changes made in san diego ca follow the developer on twitter email support report a bug privacy policy