Note:

If you want to create a new page for developers, you should create it on the Moodle Developer Resource site.

Grunt

From MoodleDocs
Revision as of 16:34, 4 March 2016 by Tim Hunt (talk | contribs)

Moodle 2.9


Grunt is a command line tool used to prepare our javascript and less-generated css for production usage. After making any change to javascript or less files in Moodle, you must run grunt to lint, minify and package the javascript/css properly so that it can be served by Moodle.

Install grunt

The Javascript modules (AMD and YUI) and less css in Moodle must be processed by some build tools before they will be visible to your web browser. We use "grunt" as a build tool to wrap our different processes. Grunt is a build tool written in Javascript that runs in the "nodejs" environment. This means you first have to install nodejs - and it's package manager "npm". The details of how to install those packages will vary by operating system, but on Linux it's probably similar to "sudo apt-get install nodejs npm". There are downloadable packages for other operating systems here: http://nodejs.org/download/. Once this is done, you can run the command: "npm install" from the top of the Moodle directory to install all of the required tools.

Running grunt

Grunt is a special node package in that it comes in 2 parts. One part is the grunt package that is installed in the node_modules folder by the "npm install" command listed in the previous section. The second part is that you also need to install the grunt-cli package globally in order to have a "grunt" command in your path. To do this run "npm install -g grunt-cli" (you may need additional permissions to do this).

Typical commands:

grunt amd               # Short-cut for grunt jshit uglify, rebuild all AMD modules.
grunt shifter           # Run shifter
grunt js                # Short-cut for grunt amd shifter

grunt css               # Run less

grunt                   # Try to do the right thing:
                        # * If you are in a folder called amd, do grunt amd
                        # * If you are in a folder called yui/src/something, do grunt shifter
                        # * Otherwise build everything (grunt css js).

On Linux/Mac it will build everything in the current folder and below. On Windows, you need to specify the path on the command line like --root=admin/tool/templatelibrary.

See also