If you want to place it somewhere else, you can edit dekit or you can make an adjustment via the GUI and tell CodeKit to save it to, say, the root of the JavaScript directory. Whenever you kick off the build process for your project (which happens whenever you save the individual JavaScript file or one of the files in app.js), it will rebuild the entire file.ĭepending on your configuration, CodeKit will write the single, minified file into the directory that corresponds to your configuration. This is what I’m calling it in my project. Of course, you don’t have to call the file app.js. Specifically, the file contains instructions for the files and the order in which I want the files added to the output file. This file is where I define the files I want to include in. Notice in the image above, I have a file called app.js. If you’ve got something like this, then setting up your environment to create a single, minified file for the project is easy. Perhaps they are in a specified directory or perhaps they are in individual files with a suffix. I’m also assuming you have a place where you’re saving your minified JavaScript files. These are the ones that you typically work with during development. There are some advantages to doing this (as well as alternative ways of doing this), but before I talk about those, I want to show how actually to do it.įirst, I assume that you have some directory structure set up so that you’ve got your un-minified, raw JavScript files. Things that other build tools tend to make a bit easier to achieve.įor example, when I’m working on a project for WordPress that will focus on a single area of the application, such as the administration area, then I prefer to take all of the various JavaScript files I’m writing and then concatenate them into a single, minified file.ĬodeKit makes this possible in two ways: Through the GUI and directives in an individual file.Ĭoncatenating JavaScript Files with CodeKit It’s not that I’m making a case for you to use it, but if you are using it, then there are some that it offers that aren’t immediately evident. I’ve been a fan of it for a long time, and it still fits well into my workflow. Once Node.Of all the various build tools that are available right now (such as Gulp, Grunt, and others), I still find myself using CodeKit. Installing Node.js on your system, will also include npm which is Node’s package manager. You can grab the latest version by going to the Node.js website. To use UglifyJS 2 to minify your Javascript, you’ll first have to make sure you have the latest version of Node.js. UglifyJS, specifically UglifyJS 2 is a Node.js command-line tool. Doing a quick Google search on UglifyJS, it looked like I was on the right path. Briefly looking over the list I came across UglifyJS. Luckily there was a list of tools that CodeKit uses. I checked out CodeKit’s help docs to see if there was any hints as to how it performs this task. So first, I needed to figure out how to go about minifying Javascript files. The easy solution would’ve been to just purchase a copy of CodeKit - which if you’ve got the money and don’t care for the command-line I would recommend since it’s supporting an indie developer - but I don’t like to pay for things if there’s a way to do it for free and I get to learn something in the process. In particular, when CodeKit minifies Javascript files. In order to make sure I’m not disrupting the workflow and assets generated by the other devs, I had to figure out how to create the same output that CodeKit was producing. The other devs that I currently work with use CodeKit and have used it to create minified or compressed version of our CSS and JS assets. But since then, I’ve become a lot more comfortable doing things in the command-line. I’ve used the demo of the first version a long time ago. CodeKit is an app that takes care of a lot of stuff such as compiling Sass files, compressing CSS and Javascript and so much more other cool stuff without touching the command-line. If you’re a web developer, chances are you’ve come across an app called CodeKit.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |