Contributing.md

How to contribute

We love pull requests. And following this guidelines will make your pull request easier to merge.

If you want to contribute but don’t know what to do, take a look at these two labels: help wanted and good first issue. Our docs and site are far from perfect too and would like to get some love.

Prerequisites

• If it’s your first pull request, watch this amazing course by Kent C. Dodds.
• Install EditorConfig plugin for your code editor to make sure it uses correct settings.
• Fork the repository and clone your fork.
• Install dependencies: npm install.
• Read the developer guide.

Development workflow

Run Babel in watch mode:

npm run compile:watch

Then open a new terminal and start an example style guide:

npm start

Open localhost:6060 in a browser.

(There are other example style guides to test particular features too, run npm run to see a list.)

Run linters and tests:

npm test

Or run tests in watch mode:

npm run test:watch

To update Jest snapshots:

npx jest -u

Don’t forget to add tests and update documentation for your changes.

Please update npm lock file (package-lock.json) if you add or update dependencies.

Integration tests (Cypress)

First install dependencies:

npm run test:cypress:pre

Then run Babel in watch mode:

npm run compile:watch

Then open a new terminal and start Styleguidist server:

npm run test:cypress:startServer

And, finally, in another separate terminal run tests:

npm run test:cypress:run

Or open Cypress UI:

npm run test:cypress:open

Other notes

• If you have commit access to repository and want to make big change or not sure about something, make a new branch and open pull request.
• We’re using Prettier to format JavaScript, so don’t worry much about code formatting.
• Don’t commit generated files, like minified JavaScript.
• Don’t change version number and change log.
• If you're updating examples other then examples/basic, you'll need to modify your start commands:

npm run start:customised # if making changes to examples/customised
npm run start:sections # if making changes to examples/sections

See the scripts section of the top level package.json

. If an example doesn't have a script just point to its config:

node bin/styleguidist.js server --config examples/path/to/example/styleguide.config.js

Need help?

• Join our Gitter or Spectrum chats and ask everything you need.