ECMWF app template

Installation

npm

$ npm install "@ecmwf.int/app-template"

yarn

$ yarn add @ecmwf.int/app-template

Usage

To run it manually:

npm

 $ npx ecmwf-app-template -c ./path/to/config/file

yarn

 $ yarn ecmwf-app-template -c ./path/to/config/file

It might be a good idea to automate the process of generating the template. It could be done in various ways depending on particular requirements.

Example configuration of package.json to include generating template using npm 'pre' hooks.

{
  "scripts": {
    "generate-template": "yarn ecmwf-app-template -c template.config.json",
    
    "prestart": "yarn generate-template",
    "start": "command-to-start-app-server",
    
    "prebuild": "yarn generate-template",
    "build": "command-to-app"
  }
}

Configuration

Available configuration options:

| Option | Required | Description | |-----------------|----------|--------------| | output | Yes | Output directory path | | title | Yes | Document title | | appName | Yes | Application Name | | layout | Yes | Type of layout ('contained' or 'fluid') | | authHost | Yes | Authentication endpoint host | | gtmId | No | Google Tag Manager ID | | headBlock | No | Block of content injected into the head of the page| | contentBlock | No | Block of content injected into the main content of the page| | helpBlock | No | Block of content injected into the logged-in user dropdown| | userMenuBlock | No | Block of content injected into the help dropdown|

Environment variables

Configuration file supports environment variables by using %VARIABLE_NAME% syntax.

Configuration file example

{
  "title": "ECMWF | Title",
  "appName": "Application Name",
  "output": "./public",
  "layout": "fluid",
  "headBlock": "./template/head.html",
  "contentBlock": "./template/content.html",
  "helpBlock": "./template/help.html",
  "userMenu": "./template/userMenu.html",
  "authHost": "%ECMWF_APP_TEMPLATE_AUTH_HOST%"
}

Development

There are two aspects of the package.

Template development

Building a template:

$ yarn build-template

Starting a development server:

$ yarn start

CLI tool and a binary to generate the template

Building a cli tool:

$ yarn build-cli

Publishing

npm

Bump a version:

$ npm version major|minor|patch

Publish:

$ npm publish

yarn

$ yarn publish