@arquivei/arquivei-ds

Download packages:

Usage no npm install needed!

<script type="module">
  import arquiveiArquiveiDs from 'https://cdn.skypack.dev/@arquivei/arquivei-ds';
</script>

README

Design System Arquivei

First steps:

Download packages:

  npm install

Run storybook:

  npm run storybook

Code Styling and Linting

ESlint

To see errors and warnings, run on terminal:

  npm run lint

There is also an ESLint extension for VS Code that will highlight errors in the editor and allow quick fixes with a keyboard shortcut.

Prettier

Prettier was added as an ESlint plugin for better code quality. To avoid conflicts, styling rules from ESLint are overriden when needed.

Check Prettier docs on integration with linters to see how was it done and more info. Access prettierrc JSON schema to see all available configs.

Stylelint

Run on terminal:

  npm run stylelint

Stylelint checks by default .css files. As we use .scss, stylelint-scss plugin was added for more SCSS specific linting rules.

Plugin stylelint-selector-bem-pattern was also added to help enforce BEM naming conventions in this project. Please notice that this plugin incorporates postcss-bem-linter, so check examples on both documentations when configuring.

Usage

This lib is available via CDN or as an NPM package:

  <link rel="stylesheet" type="text/css" href="https://cdn-gcp.arquivei.com.br/arquivei-ds/dist/bundle.css">

  npm install @arquivei/arquivei-ds --save