About Features Downloads Getting Started Documentation Events Support GitHub

Love VuFind®? Consider becoming a financial supporter. Your support helps build a better VuFind®!

Site Tools


Warning: This page has not been updated in over over a year and may be outdated or deprecated.
development:grunt

This is an old revision of the document!


Grunt Manual

Grunt is a javascript and nodejs based task runner. It has been configured to run several tasks for front end manipulation and packaging. Here are some commands. For more advanced methods, please see our community scripts page.

Default

Just running “grunt” will perform the less and js compression tasks.

grunt less

Compiles all less files into a compressed css file. By default works for bootstrap3 and bootprint3.

To use:

  1. add path to theme's less folder to start of paths (look up path for imports).
    paths: ["themes/CUSTOM/less", "themes/bootprint3/less", "themes/bootstrap3/less"],
  2. add destination file and link to root less file.
    files: {
      "themes/bootstrap3/css/compiled.css": "themes/bootstrap3/less/bootstrap.less", // you can remove
      "themes/bootprint3/css/compiled.css": "themes/bootprint3/less/bootprint.less", // these if you wish
      "themes/CUSTOM/css/compiled.css": "themes/CUSTOM/less/custom.less"
    }
  3. run
    grunt less
  4. adjust theme.config.php to point to new compressed file.

grunt sass

Compiles all sass files into a compressed css file. By default works for bootstrap3 and bootprint3.

  1. add path to theme's sass folder to start of loadPath (look up path for imports).
    loadPath: ["themes/CUSTOM/sass", "themes/bootprint3/sass", "themes/bootstrap3/sass"],
  2. add destination file and link to root sass file.
    files: {
      "themes/bootstrap3/css/compiled.css": "themes/bootstrap3/sass/bootstrap.scss", // you can remove
      "themes/bootprint3/css/compiled.css": "themes/bootprint3/sass/bootprint.scss", // these if you wish
      "themes/CUSTOM/css/compiled.css": "themes/CUSTOM/sass/custom.scss"
    }
  3. run
    grunt sass
  4. adjust theme.config.php to point to new compressed file.

grunt js

Compress vendor files in bootstrap3 into a single called “vendor.min.js”.

Specifically, it creates a compressed file that includes jquery, bootstrap.js, then all vendor files except for bootstrap-slider.js (not compatible with “use strict” required for compression), and finally autocomplete.js.

To compress your own code: refer to the grunt-contrib-uglify documenation or base your subtask on vendor_min. You can run specific js compression subtasks like this:

grunt uglify:vendor_min

Don't forget to update your theme.config.php.

grunt lessToSass

Converts all less files to sass. Mostly for the VuFind dev team.

development/grunt.1467382870.txt.gz · Last modified: 2016/07/01 14:21 by crhallberg