To deploy the theme simply put the files into your webserver (ex : www.example.com) and navigate to it through the browser
Chaanging and deploying
The theme comes with grunt.js integration and bower so in order to have an optimised installation the recommended way is buy performing the grunt and bower tasks described bellow.
The theme contains a test grunt task using jshint to go trough the code and find possible issues with the code.
Production / Minified
Compiling the theme
To perform the grunt tasks you will need the following things installed in either your local maching (recommended) or on the webserver, depending where you are performing the tasks. For more information on grunt follow this link : http://gruntjs.com/
1 ) Install node.js on your maching. It provides also installations for all other platforms : http://nodejs.org/download/
On Ubuntu running the sudo apt-get install nodejs might run into problems as the version available in the package manager is not supported. For more info check : http://stackoverflow.com/questions/12913141/installing-from-npm-fails
2 ) Before setting up Grunt ensure that your npm is installed and up-to-date by running npm update -g npm (this might require sudo on certain systems). To install on linux you can run : sudo apt-get install npm
2 ) Install grunt Command line interface (CLI) by following : http://gruntjs.com/getting-started
3 ) make sure all packages are installed by running in your application root folder the following : sudo npm install
4 ) Enable all dependencies by running : bower install
5 ) Run the task you want :
- grunt dev (grunt --force dev for forcing erros to pass)
- grunt test (grunt --force test for forcing erros to pass)
- grunt minified (grunt --force minified for forcing erros to pass)
- grunt copy-icons (grunt --force minified for forcing erros to pass).
This will compile the scripts in the application (app, controllers, directives, services, all extra scripts like all the charting libraries etc) and put them into one single js file and one single css file inside the destination folder in this case "dist".
After that simply push your root files and the dist folder into the webserver and you are done! You have a full compressed and optimized site running.
Files contained in the compressed application :
Problem while copying files
When copying the icons you might run into an issue where grunt is trying to open too many files (its a lot of images). You can run the command to Increase file limit size : ulimit -n 10240. Alternatively you can also copy the icons folder manually from the folder bower_components/material-design-icons. Make sure to copy all svg files into the same folder dist/img/icons
package.json - Development dependencies
In the file package.json are included the development dependencies, namely all the grunt modules to be able to run grunt to compile the theme. To instal the dependencies run npm install and this will install all the dependencies.
To install a new dependency and save the dependency run the following command :
- npm install npm_module --save-dev
Bower.json - External dependencies
All dependenies are listed in the bower.json file. When running bower install all dependencies like jquery, angular, chartjs etc will be installed in the folder bower_components.
When asked to choose jquery version choose version 2.1.4.
To include new dependencies run the following command to both install and save the dependency :
- bower install package_name --save