mo-display v3.0.0

mo-display

React Display Library by Team Moda

Contributing Guidelines

• Write clean code

Getting Started

Making Commits

We are using semantic release for this repo and commitizen to help with formatting commits.

• Install the commitizen CLI with yarn global add commitizen
• To run through the CLI: stage your files to commit and run git cz.

Development

Currently this library is exposed in two ways: as a package over NPM and as a static JavaScript file over CDN.

Building

Mojo consumes this package through the CDN — which exposes the library over window.MoDisplay.

yarn build:mojo

Publishing on NPM

Website consumes this package through the actual NPM package; but then declares it as external when it too is built and exposed over the CDN.

Does this make version mismatch bugs likely? Yes. Be careful making breaking changes to anything that is consumed in both repos.

yarn publish

Running locally inside of mojo

• Start the dev server with yarn mojo:dev
• Start mojo with these environment variables:

DISPLAY_LIB_CSS_URL=http://localhost:8002/mo-display.css
DISPLAY_LIB_SCRIPT_URL=http://localhost:8002/mo-display.min.js

Storybook

Sometimes it's easier and makes for better code to develop your component in isolation. To help with that we use a tool called storybook.

To create a new story, add a file to the stories/ directory with a *.stories.js extension.

To run storybook you can use yarn start or yarn storybook. Then you can view the storybook at http://localhost:9001

Useful URLs

Production

https://assets10.modaoperandi.com/assets/display-lib/mo-display-production.min.js https://assets10.modaoperandi.com/assets/display-lib/mo-display-production.css

Staging

https://assets10.modaoperandi.com/assets/display-lib/mo-display-staging.min.js https://assets10.modaoperandi.com/assets/display-lib/mo-display-staging.css

Master ("Integration")

https://assets10.modaoperandi.com/assets/display-lib/mo-display-master.min.js https://assets10.modaoperandi.com/assets/display-lib/mo-display-master.css