@dickssportinggoods/common v0.0.1

Core

This is a common module that only contains .scss and .ts files with common code that can be shared between component libraries of different frameworks.

The .ts and .scss files are not processed when building, they are just copied and it is expected that component library will be able to handle them. The reason is because this package is an internal package used by the different frameworks we have component libraries for.

The purpose is to expose variables, immutable spacing utilities, and common component CSS classes. This also centralizes every design token in this package, ensuring consistency across component libraries of different frameworks (i.e. Angular, React).

In short, this package will contain JS + d.ts files along with SCSS.

Installing

See parent readme file for more information.

Building

For development npm run build:watch will keep an eye on .scss and .ts files and update the dist folder automatically.

npm run build: wipes the dist directory and rebuilds everything from scratch

Testing

Jest is the library used to write tests.

npm run test:ci runs jest on CI mode, useful for prepush hooks and pipeline. npm run test:watch useful for developers to have a watcher mode on, re-executing affected tests when changes happen.

Creating Component Essences

Essences are the agnostic part of a component that exists in the component library. This common part consists of Typescript code, SCSS files, and a README.md file that helps explain abstractly how this component should be builtd in any given framework.

Obviously the abstract structure isn't 100% applicable to all frameworks, for instance Angular enforces host elements for components, and that may change where and how the CSS is applied.

The README.md file of a component essence should follow this pattern.