Geovistory Design System consists of two types of components: Ionic components and Geovistory components.
At Geovistory, we create components to display data from our research projects, and we are constently updating them, enhancing the behavior, and adding new ones.
We also encourage our community to participate to this development by creating commponents which answer to their specific needs. We will be glad to add them to the Geovistory project!
The components are coded as Stencil components. Doing so, we have Angular, React and Web component versions of each component made, without having to redevelop everything for each technology. They are available through npm packages:
Install (all packages)
npm i
Start dev servers
npm run dev
In case you see this error:
[📕_STORYBOOK] Failed to resolve import "../dist/esm/polyfills/index.js" from "loader\index.js". Does the file exist?
please cancel and restart the above command.
Add a component
# open main package
cd packages/design-system-web
# generate a component
npm run generate
# enter component name (starting with geov-*)
? Component tag name (dash-case): › geov-my-component
Run tests
npm run test
Build
npm run build
In order to build the storybook run:
npm run storybook
This generates a website in ./storybook
. To serve the built storybook website, run:
npm run storybook:serve
The packages are published to npm on each release by the Release workflow.
For manual publications of dockerized PR do the following:
Let the Dockerize workflow run
Pull the changes to your local repo
Run this command:
# clean install dependencies
npm ci
# build
npm run build
# publish: replace <XYZ> with version number you find in lerna.json -> version
# example for <XYZ>: 1.1.1-pr-18.32
lerna publish <XYZ> --no-git-tag-version --no-changelog --dist-tag next