chromatic readme

This commit is contained in:
Ulf Gebhardt 2023-11-22 09:34:08 +01:00
parent 84afaa4e40
commit 0d69388c7d
Signed by: ulfgebhardt
GPG Key ID: DA6B843E748679C9

View File

@ -14,6 +14,7 @@
[![vitest][badge-vitest-img]][badge-vitest-href] [![vitest][badge-vitest-img]][badge-vitest-href]
[![storybook][badge-storybook-img]][badge-storybook-href] [![storybook][badge-storybook-img]][badge-storybook-href]
[![vuepress][badge-vuepress-img]][badge-vuepress-href] [![vuepress][badge-vuepress-img]][badge-vuepress-href]
[![chromatic][badge-chromatic-img]][badge-chromatic-href]
The IT4C Boilerplate for frontends The IT4C Boilerplate for frontends
@ -31,30 +32,32 @@ This projects utilizes `storybook` to develop frontend components and `vuepress`
The following commands are available: The following commands are available:
| Command | Description | | Command | Description |
|-----------------------------|-------------------------------------------------| |-----------------------------|--------------------------------------------------|
| `npm install` | Project setup | | `npm install` | Project setup |
| `npm run build` | Compiles and minifies for production | | `npm run build` | Compiles and minifies for production |
| `npm run server:prod` | Runs productions server | | `npm run server:prod` | Runs productions server |
| **Develop** | | | **Develop** | |
| `npm run dev` | Compiles and hot-reloads for development | | `npm run dev` | Compiles and hot-reloads for development |
| `npm run server:dev` | Run development server | | `npm run server:dev` | Run development server |
| **Test** | | | **Test** | |
| `npm run test:lint` | Run all linters | | `npm run test:lint` | Run all linters |
| `npm run test:lint:eslint` | Run linter eslint | | `npm run test:lint:eslint` | Run linter eslint |
| `npm run test:lint:locales` | Run linter locales | | `npm run test:lint:locales` | Run linter locales |
| `npm run test:lint:remark` | Run linter remark | | `npm run test:lint:remark` | Run linter remark |
| `npm run test:lint:style` | Run linter stylelint | | `npm run test:lint:style` | Run linter stylelint |
| `npm run test:unit` | Run all unit tests and generate coverage report | | `npm run test:unit` | Run all unit tests and generate coverage report |
| `npm run test:unit:dev` | Run all unit tests in watch mode | | `npm run test:unit:dev` | Run all unit tests in watch mode |
| `npm test` | Run all tests & linters | | `npm test` | Run all tests & linters |
| **Storybook** | | | **Storybook** | |
| `npm run storybook` | Run Storybook | | `npm run storybook` | Run Storybook |
| `npm run storybook:build` | Build static storybook | | `npm run storybook:build` | Build static storybook |
| `npm run storybook:test` | Run tests against all storybook stories | | `npm run storybook:test` | Run tests against all storybook stories |
| **Documentation** | | | **Documentation** | |
| `npm run docs:dev` | Run Documentation in development mode | | `npm run docs:dev` | Run Documentation in development mode |
| `npm run docs:build` | Build static documentation | | `npm run docs:build` | Build static documentation |
| **Chromatic** | |
| `npm run chromatic` | Run Chromatic. See Chromatic section for details |
### Docker ### Docker
@ -95,7 +98,6 @@ The following endpoints are provided given the right command is executed or all
## TODO ## TODO
- [ ] figma - [ ] figma
- [ ] chromatic
- [ ] feature zähler -> pinia tore - [ ] feature zähler -> pinia tore
## Known Problems ## Known Problems
@ -151,3 +153,6 @@ Currently none
[badge-vuepress-img]: https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fraw.githubusercontent.com%2FIT4Change%2Fboilerplate-frontend%2Fmaster%2Fpackage.json&query=devDependencies.vuepress&label=vuepress&color=orange [badge-vuepress-img]: https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fraw.githubusercontent.com%2FIT4Change%2Fboilerplate-frontend%2Fmaster%2Fpackage.json&query=devDependencies.vuepress&label=vuepress&color=orange
[badge-vuepress-href]: https://vuepress.vuejs.org/ [badge-vuepress-href]: https://vuepress.vuejs.org/
[badge-chromatic-img]: https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fraw.githubusercontent.com%2FIT4Change%2Fboilerplate-frontend%2Fmaster%2Fpackage.json&query=devDependencies.chromatic&label=chromatic&color=orange
[badge-chromatic-href]: https://www.chromatic.com/