Emerald CLI

Command-line tool for creating, developing, building and testing Emerald web components.

Directory structure

Emerald CLI assumes a monorepo folder structure.

packages/
├── package-one/
│   ├── public/
│   │   ├── index.js
│   │   └── index.html
│   └── src/
│       ├── packageOne.js
│       └── packageOne.spec.js
├── package-two/
│   ├── public/
│   │   ├── index.js
│   │   └── index.html
│   └── src/
│       ├── packageTwo.js
│       └── packageTwo.spec.js

Build

Builds some or all packages for distribution. It creates a dist folder with compiled Javascript code and injected CSS.

The Javascript is compiled with the following variations:

• Native imports and ES6 code;
• Native imports and ES5 code;
• CommonJS imports and ES6 code;
• CommonJS imports and ES5 code.

Parameters

• -r or --root – The folder where packages live. String. Defaults to packages. Use --no-root to bypass;
• -s or --scope – The package to build (omit for all packages). String. Defaults to *. Use --no-scope to bypass;
• -i or --input-dir – The folder where source files live. String. Defaults to src. Use --no-input-dir to bypass;
• -D or --deploy – Whether or not the build is meant for deployment. Boolean. Defaults to false;
• -c or --concurrency – Number of packages processed at once. Number. Defaults to INFINITY.

Scope is a positional parameter and can be passed without flags after the command itself.

When deploy is set to true, the CSS is also be injected in source folder files.

Examples

emd build

emd build my-component

emd build --deploy --concurrency=5

Create

Creates a new folder structure for an Emerald web component, either basic or business.

Parameters

• -r or --root – The folder where packages live. String. Defaults to packages. Use --no-root to bypass;
• -n or --name – The component name. String;
• -t or --type – The component type. Can be either basic or business. String. Defaults to basic.

Name is a positional parameter and can be passed without flags after the command itself.

Examples

emd create "My Component"

emd create "My Component" --type=business

Start

Starts the development server using files from the public folder.

Parameters

• -r or --root – The folder where packages live. String. Defaults to packages. Use --no-root to bypass;
• -s or --scope – The package to start. String;
• -A or --allowGitIgnored – Whether or not to allow files ignored by git. Boolean. Defaults to false;
• -H or --host – The server host. String. Defaults to localhost;
• -p or --port – The server port. String. Defaults to 8080;
• -l or --legacy – Wheter or not to use ES5 mode. Boolean. Defaults to false.

Scope is a positional parameter and can be passed without flags after the command itself.

Example

emd start my-component

Storybook

Starts Storybook.

Parameters

• -r or --root – The folder where packages live. String. Defaults to packages. Use --no-root to bypass;
• -c or --config – The folder where config.js file lives. String. Defaults to .storybook.
• -H or --host – The server host. String. Defaults to localhost;
• -p or --port – The server port. String.

Example

emd storybook

Test

Run tests specified on *.spec.js files.

Parameters

• -r or --root – The folder where packages live. String. Defaults to packages. Use --no-root to bypass;
• -s or --scope – The package to test (omit for all packages). String. Defaults to *. Use --no-scope to bypass;
• -i or --input-dir – The folder where source files live. String. Defaults to src. Use --no-input-dir to bypass.

Scope is a positional parameter and can be passed without flags after the command itself.

Examples

emd test

emd test my-component