@procore/contentful-renderer

@procore/contentful-renderer

Provide Markdown and Rich Text Contentful renderers.

Installation

yarn add @procore/contentful-renderer

To finish setting up your package:

• Rename package/example-package to be your package name.
• Insert your code into the src folder.
• Update your package.json name and description values.
• Update catalog-info.yaml with your package name.
• Run yarn install.

Publishing Storybook by Chromatic

The Chromatic snapshot testing (Regression Testing) is turned off by default as we can publish stories to Chromatic without running these tests.

Note: DO NOT turn on regression testing without acquiring leadership sign off for funding as this will accrue cost

References: Chromatic Docs

How to publish stories from local machine

In order to publish stories to Chromatic:

• Please copy the Chromatic project token to .env file:

// .env
CHROMATIC_PROJECT_TOKEN=your-token-here

• Run chromatic script:

yarn chromatic

How to publish stories with CI tools

• Please copy the Chromatic project from Chromatic token to CI Environment value.

• Add new job to your process. Circle CI example:

  workflows:
    ...
    jobs:
      - storybook_chromatic_deployment:
      requires:
          - setup
  

  jobs:
      storybook_chromatic_deployment:
      steps:
      - run:
          name: Deploy To Chromatic
          command: yarn chromatic:ci
  

• Optionally(Recommended) if you like to speed up the build with Chromatic you can use the already built stories so we can depend the Chromatic build on the generated build from Storybook build. Steps are as following:

  • Add --storybook-build-dir ./storybook-static flag to the chromatic script.(Already added)

  • Add --webpack-stats-json flag to storybook:build.(Already added)

  • Add the steps to build stories before building Chromatic.

            ```
            workflows:
                - storybook_chromatic_deployment
                  requires:
                    - build_storybook
            ```
    
    </details>
     <details>
    

    How to see published storybook:
    Please visit: https://www.chromatic.com/docs/setup#view-published-storybook