VTEX Styleguide React components (Docs)
For instructions on how to use the Styleguide in your project refer to the page itself: https://vtex.github.io/styleguide/.
Run this in this repo:
In your project run:
npm link @vtex/styleguide
Import (case a
<Button> component in lib):
import Button from '@vtex/styleguide/lib/Button'
Developing new tests
To add tests to a component, just add a test file with the
.test.js extension next to the component implementation.
react/components/Alert/ ├── README.md ├── index.js └── index.test.js
We use react-testing-library to test our components.
To run the test use:
You can also pass the
yarn test --watch
Styleguide is currently being developped for two major versions at the same time,
This means that after a merge of a feature to the
9.x branch has to be updated to stay at the same version level.
8.52.1 just got released, the update on
9.x should update the version to
To post the changelog on Github Release Notes, is required to configure a Personal Token. See more here
We use releasy to publish our styleguide. To publish on both npm and render(VTEX IO) with Github Release Notes, execute the command below:
To update the docs:
Your project has to run with webpack >= 2. Here's a guide for upgrading Webpack to v2.
VTEX Styleguideis a project built to run on top of either
VTEX IO. To make this viable, we currently use two
package.jsonfiles, one in the top repository folder for
npm, and one inside the
VTEX IO. We are looking into how we can improve this architecture, but for now we have to live with duplicated dependencies in these
For more info, please refer to https://github.com/vtex/styleguide/issues/483