Features Videos Help About Updates
Menu Buy Now

The Build Process

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

What's A Build?

A Build is just a set of steps that CodeKit performs to process everything in your Project at once.

You get to define the steps and, optionally, add custom ones that can make CodeKit do anything.


Opening The Build Area

Click the bottom Command Button in the main window:

a screenshot of the build process in CodeKit

This window shows each step CodeKit will perform when building your project. Initially, there's only one:

The "Process Remaining" Step

This is the default Build Step. It exists for all Projects and cannot be removed. When it runs, CodeKit processes every file that has an Output Action other than Ignore.

For files set to Process, CodeKit runs any built-in processing and then runs any Hooks that apply to that file. Files set to Copy are copied to their output locations, then any applicable Hooks are run.

Step Order

Steps run in top-down order. Each step completes before the next one starts. To change the order, drag a step up or down.

Naming Steps

You can rename a step by clicking its title. This does not apply to the "Process Remaining" step, which cannot be renamed.


Adding New Steps

Click the giant "+" button to add a step. There are two types to choose from:

"Run Script" Build Step

This type of step lets you define a custom Bash script or AppleScript that CodeKit should run. You can use this to do literally anything, including running node.js scripts, uploading your site to a server, and more.

"Process Certain Files" Build Step

Sometimes, you need to compile some files before others. This type of Build Step lets you tell CodeKit to do that. Add certain files to the step, then drag it above the "Process Remaining Files" step.

Made in San Diego, CA

Follow the Developer on Twitter

Email Support

Report a Bug

Privacy Policy