Skip to main content Link Menu Expand (external link) Document Search Copy Copied

@if

You can use @if with condition expression using the features array.

You have to pair every @if with one @endif. @if can be nested (there are plenty examples of nested if in our examples skeleton repos).

For features

var features = [ 'something', 'very-good' ];

JavaScript syntax

A json file like:

{
  // @if !something
  "other-thing": true,
  // @endif
  // @if something && very-good
  "good-stuff": true,
  // @endif
}

Or

{
  /* @if !something */
  "other-thing": true,
  /* @endif */
  /* @if something && very-good */
  "good-stuff": true,
  /* @endif */
}

Yield result:

{
  "good-stuff": true,
}

You may noticed the result is not a valid JSON, there is one extra comma. “makes” actually will clean up any JSON file for writing to final project, this is specially designed to cater condition inside JSON file.

Different from original preprocess, the /* @if/@endif */ in “makes” will retain the leading and tailing white spaces (especially new line). This is designed for the skeleton authors to fine control the output.

HTML syntax

<div>
  <!-- @if !something -->
  <other-thing></other-thing>
  <!-- @endif -->
  <!-- @if something && very-good -->
  <good-stuff></good-stuff>
  <!-- @endif -->
</div>

Yield result:

<div>
  <good-stuff></good-stuff>
</div>