JS and CSS Packages & Libraries

Although any javascript package that is available through CDN (Content Delivery Networks) can be used by Akumen’s Pages, this is generally not recommended in a production environment due to the possibility of the CDN not being available. Examples of CDNs include jsdelivr or cdnjs.

Akumen provides minified versions of some of the more common packages including grids and charts. They only need to be included in on of the html files in your project, using the following syntax:

<script src="/bundles/vue.js"> or <link rel="stylesheet" href="/bundles/buefy.css" />

This includes the Vue framework, including Semantic UI Vue as well as a date picker control for Vue.

Packages include:

  • /bundles/vue.js - Vue framework documentation
  • /bundles/axios.js - Promise based HTTP client for the browser documentation
  • /bundles/semantic.js - The actual Semantic framework documentation
  • /bundles/semantic.css - The CSS classes for Semantic
  • /bundles/d3.js - D3 charting library documentation
  • /bundles/buefy.js - Lightweight UI components for Vue.JS documentation
  • /bundles/buefy.css - CSS required for Buefy
  • /bundles/pako.js - Compression library
  • /bundles/moment.js - Date & Time library, used to handle date and time much better than javascript can.
  • /bundles/minimal.events.js - Tells the page to include the libraries required to run events. Note that these events will need to be manually included (unlike in the templated page). These are best suited for minimal pages.
  • /bundles/font-awesome.css - Tells the page to include the font awesome 4 libraries

Utilising the bundles means that Akumen can fetch the bundles locally, instead of fetching them from remote sources.

If further bundles are required, contact Akumen Support to include them in the release.

In addition, bundles and other libraries can also be included in the main page load using configuration on the page itself. This provides a better experience in that these bundles are loaded prior to the user specified page loading. See here for more information.