Combine and minify scripts

PHP
1

Hi everyone,

I’m looking for a script that will combine, minify and Gzip all of my CSS and JavaScript files. I’ve come across this script:

https://www.sonassi.com/knowledge-base/combine-and-compile-css-and-js-into-gzipped-files/

Has anyone used this before and if so can you recommend it? Or are there other scripts that would work better?

Thank you for any advice!

2

Hi,

You can use Grunt for this (and many other things).
Here’s a good tutorial: http://24ways.org/2013/grunt-is-not-weird-and-hard/

3

Hi Pullo,

thanks a lot for the link. I’m busy trying out Grunt - always more things to learn.

You are probably looking forward to the football tonight? Germany 4 - 0 USA :wink:

Cheers

4

Hey Pullo,

already running into a problem. After creating package.json I’m supposed to navigate to my folder using the command prompt and then what? When I open the command prompt I have C:\Users\user1> I can’t add C:\wamp\www\myproject to the end of this. I’ve also had a look at the Grunt documentation. After placing package.json and Gruntfile.js in the appropriate folder, npm install grunt --save-dev should be run. Must I run this from the standard command prompt? It will know where to install Grunt?

Sorry for the hassle. Perhaps you will know how this works.

Thank you!!!

5

Ok, I got the installation working. Had to change to my project’s directory using the command “cd”. After running npm install I see that a folder has been created “node_modules”. This folder is over 6mb in size and contains another “node_modules” folder. The latter folder contains 20 or so modules such as colors, hooker, minimatch etc. Is this normal? Do I need all of these modules? My package.json file just has “devDependencies”: {
“grunt”: “~0.4.1”
}

Can someone please confirm whether this is the usual way of installing Grunt?

Thanks!

6

Hi RedBishop,

That sounds about right, although the directory structure should be:

Project root
  - node_modules
    - grunt
      - internal-tasks
      - lib
      - node_modules
        - colors
        - hooker
        - minimatch
          etc ...
7

Ok, thanks Pullo!