/eureka-build

Base build project utilising the latest web technologies inc. grunt controlling sass, javascript, image spriting

Primary LanguageJavaScriptMIT LicenseMIT

eureka-build

My base build project utlising NPM and Grunt, Sass, Compass, Image spriting
JS hint, CSS lint, JS Uglify, concat and all the lovely tools I like to use.

Getting started!

  1. Make sure you have latest version of Compass installed. If its not installed, visit the website
    for more details: http://compass-style.org/install/

  2. Install node dependencies using the following command:

    npm install

  3. Install susy:

    gem install susy

  4. The src folder is where all working styles/scripts/png images will be placed. The assets folder is where all compiled code will be dropped. This is the only folder you will need when deploying a site using eureka-build.

  5. To compile your code, run one of the following commands:

    grunt development
    grunt build

  6. The watch command will look for changes made to your styles, scripts or pngs placed in the sprite folder:

    grunt watch

    Use ctrl+c to cancel this command

  7. To add more js libraries, drop them into the libs folder and then add them to the grunt file in the jsFileList array. They will be compiled into a js file called build.js.



7. All pngs that you want to be sprited, need to be dropped into the sprites folder located src/images/sprites/. They will then be combined into a sprite png located in the assets folder along with the relevant Sass code
located in the sprite style sheet _sprite.scss.

================= Thats it! Have fun and feel free to suggest more useful web development libraries.

Credit:

More info can be found here: www.andrew-cocker.co.uk