loading table of contents...

Frontend Developer Manual / Version 2310

Table Of Contents

6.3.12 Utilities

This brick contains different utilities for SASS, templates and JavaScript that provide reusable and helpful macros and functions to use in bricks and themes.

JavaScript Utilities

For JavaScript the brick offers functions like our logger, to extend jQuery and others. They are all documented in their source files and to use them they need to be imported in the code first like in the following example:

import { log } from "@coremedia/brick-utils";

log("Logging something");

Example 6.4. Example import of the logger

Sass Utilities

The Sass mixins and functions are available in a theme or brick without explicit import and can be used like the following example:

.button {
  @include center-absolute();

Example 6.5. Example use of center-absolute mixin

FreeMarker Utilities

The FreeMarker macros and functions need to be imported in the templates where they are to be used. For example:

<#import "*/node_modules/@coremedia/brick-utils/src/freemarkerLibs/components.ftl" as components />

<@components.button text=cm.getMessage("button_text") attr={"type": "submit"} />

Example 6.6. Example use of the button macro

Search Results

Table Of Contents

Your Internet Explorer is no longer supported.

Please use Mozilla Firefox, Google Chrome, or Microsoft Edge.