Tresdoce-ui es la implementación React del Design System de Tresdoce. Se aplicó la metodología Atomic Design para el diseño de los componentes y se generaron los siguientes paquetes:
@tresdoce-ui/brand: contiene las fuentes e imágenes.@tresdoce-ui/core: contiene los componentes más atómicos.
Los componentes que contiene este repositorio se desarrollan con las siguientes librerías:
- Babel: v7
- React: v16.8
- Styled-components: v5
- TypeScript: v4
- Storybook: v6
- Build: Pika Pack
Se debe crear un archivo .npmrc dentro del proyecto para utilizar el Nexus Corporativo:
.npmrc
registry=http://143.198.236.101:8081/repository/npm-group/
_auth=<token>
Luego instalar las siguientes librerías:
npm i --save @tresdoce-ui/brand @tresdoce-ui/coreIngresá a ./packages/core y corres el script
npm run generate ComponentNamePara poder comenzar a desarrollar necesitas tener instalado el paquete lerna como una dependencia global:
npm i -g lernaLuego de eso, se debe correr el siguiente comando:
npm iEsto va a permitir que se instalen las dependencias del proyecto root y de todas las librerías que están dentro de la carpeta packages.
Para desarrollar localmente se utiliza Storybook. Para el entorno de desarrollo local, se debe ejecutar:
npm run storybookEl proyecto cuenta a nivel global con los siguientes comandos disponibles para ejecutar:
// Permite remover los datos generados por el build
npm run clean
// Permite generar un build por cada package dentro de packages
npm run build
// Permite instalar todas las dependencias por cada package dentro de packages
npm run install
// Permite publicar todos los packages buildeados a NPM
npm run publish
// Permite hacer un build de storybook para exportarlo como un HTML hosteable
npm run create:storybook