CodeKit does many things with JavaScript.
Click on a task for details:
• Scan for syntax errors with ESLint.
Quickly find problems and enforce personal coding style—spaces not tabs!
• Bundle files together with Rollup.
Use import statements to combine JS files (ES6 modules).
• Transpile files with Babel.
Write next-generation JavaScript, then translate it back to the older standards that today's browsers understand.
• Minify files with Terser.
Make JS files smaller to reduce page-load time.
Simple JavaScript Imports
If you don't want to use ES6 Modules (or you're working with a library that does not support them), CodeKit offers another, simpler way to combine JavaScript files.
Special Comments
Special comments in your JS files tell CodeKit how to combine them. These comments let you prepend or append one JS file to another. They look like this:
// @codekit-prepend "someFile.js"; ... // @codekit-append "../someOtherFile.js";
You can also combine multiple files at once with a comma-separated list:
// @codekit-prepend "jQuery.js", "../otherFile.js";
The Quiet Keyword
Sometimes, you don't want the syntax checker to warn you about issues in linked files. Use the quiet keyword to automatically silence those issues:
// @codekit-prepend quiet "jQuery.js";
The keyword can appear anywhere on the special comment line and applies to all files on that line. This is equally valid:
// @codekit-prepend "jQuery.js", "otherFile.js" quiet;
Details
CodeKit creates a chain of JS files based on your prepend/append statements and then simply combines the content of each file in that chain, in order. The whole chain is then processed as one giant piece of JavaScript, whether you're syntax-checking, transpiling, or minifying.
Future-Proof
CodeKit will always support these special comments. You can rely on them. That said, it's a good idea to use ES6 Modules when you can, since that's a universal standard.
Why Can't I Just Import a File Anywhere?
CodeKit allows you to add one JS file to the beginning or end of another, but does not allow you to import the contents of one file into the middle of another at a specific point. Doing so would be very unpredictable because JavaScript hoists variables to the top of the current scope. It would also create opportunities for variable shadowing and bugs that are insanely difficult to find.